website-session-kit
Version:
A modular and extensible session management toolkit for modern websites.
13 lines (12 loc) • 1.59 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import LpContentContainer from '../../containers/LpContentContainer';
import Line from '../../ui/Line';
const HeaderSection = ({ logo, type, title, descriptionBefore, descriptionAfter, extra, bgGradient = 'bg-gradient-to-b from-[#00172f] to-black', textColor = 'text-white', paddingSmX = 'sm:px-[25%]', grafismColor = '#e16a3d', grafismWidth = 150, lineColor = '#e16a3d', }) => {
const renderLogo = () => {
if (!logo)
return null;
return typeof logo === 'string' ? (_jsx("img", { src: logo, alt: "logo", className: "mx-auto mb-4 max-w-[200px]" })) : (_jsx("div", { className: "mb-4", children: logo }));
};
return (_jsx("header", { children: _jsxs(LpContentContainer, { className: `text-center ${textColor}`, paddingSmX: paddingSmX, grafismColor: grafismColor, grafismWidth: grafismWidth, containerBgColor: bgGradient, children: [renderLogo(), _jsxs("div", { className: "space-y-3", children: [type && _jsx("p", { className: "text-sm font-light mt-4 uppercase tracking-wide", children: type }), descriptionBefore && _jsx("p", { className: "text-md uppercase mt-2", children: descriptionBefore }), _jsx("h1", { className: "text-4xl uppercase mt-2", children: title }), descriptionAfter && _jsx("p", { className: "text-md uppercase mt-2", children: descriptionAfter })] }), _jsx(Line, { color: lineColor }), extra && (_jsx("div", { className: "space-y-1", children: _jsx("p", { className: "text-sm font-light uppercase", children: extra }) }))] }) }));
};
export default HeaderSection;