stackpress
Version:
Incept is a content management framework.
23 lines (22 loc) • 1.96 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = LayoutHead;
const jsx_runtime_1 = require("react/jsx-runtime");
function LayoutHead(props) {
const { open, theme, base, logo, brand, left, right, toggleLeft, toggleRight, toggleTheme } = props;
const classNames = ['layout-head'];
if (left) {
classNames.push('left');
}
if (right) {
classNames.push('right');
}
if (open === null || open === void 0 ? void 0 : open.left) {
classNames.push('open-left');
}
if (open === null || open === void 0 ? void 0 : open.right) {
classNames.push('open-right');
}
const themeIcon = theme === 'dark' ? 'fa-moon' : 'fa-sun';
return ((0, jsx_runtime_1.jsx)("header", { className: classNames.join(' '), children: (0, jsx_runtime_1.jsxs)("div", { className: "container", children: [toggleLeft && ((0, jsx_runtime_1.jsx)("button", { className: "menu", onClick: toggleLeft, children: (0, jsx_runtime_1.jsx)("i", { className: "fas fa-bars" }) })), (0, jsx_runtime_1.jsx)("div", { className: "bar", children: base ? ((0, jsx_runtime_1.jsxs)("a", { href: base, children: [logo && (0, jsx_runtime_1.jsx)("img", { src: logo, alt: brand, className: "logo" }), brand && (0, jsx_runtime_1.jsx)("span", { className: "brand", children: brand })] })) : (brand || logo) ? ((0, jsx_runtime_1.jsxs)("span", { children: [logo && (0, jsx_runtime_1.jsx)("img", { src: logo, alt: brand, className: "logo" }), brand && (0, jsx_runtime_1.jsx)("span", { className: "brand", children: brand })] })) : undefined }), toggleTheme && ((0, jsx_runtime_1.jsx)("button", { className: "theme", onClick: () => toggleTheme(), children: (0, jsx_runtime_1.jsx)("i", { className: `fas ${themeIcon}` }) })), toggleRight && ((0, jsx_runtime_1.jsx)("button", { className: "user", onClick: toggleRight, children: (0, jsx_runtime_1.jsx)("i", { className: "fas fa-user-circle" }) }))] }) }));
}