gh_UserManager/apps/web/components/ui/section.tsx
bermooda-company 54d5891edf user
2026-08-23 23:59:14 +03:30

49 lines
1005 B
TypeScript

import { cn } from "@/lib/utils";
export function Section({
id,
className,
children,
}: {
id?: string;
className?: string;
children: React.ReactNode;
}) {
return (
<section id={id} className={cn("relative py-20 sm:py-28", className)}>
{children}
</section>
);
}
export function SectionHeading({
eyebrow,
title,
subtitle,
align = "center",
}: {
eyebrow?: string;
title: string;
subtitle?: string;
align?: "center" | "start";
}) {
return (
<div
className={cn(
"mb-12 max-w-2xl",
align === "center" ? "mx-auto text-center" : "text-start"
)}
>
{eyebrow ? <span className="eyebrow">{eyebrow}</span> : null}
<h2 className="mt-4 text-3xl font-bold tracking-tight text-slate-900 dark:text-white sm:text-4xl">
{title}
</h2>
{subtitle ? (
<p className="mt-4 text-base leading-relaxed text-slate-600 dark:text-slate-400">
{subtitle}
</p>
) : null}
</div>
);
}