الملفات
gracesalmoun/components/section-heading.tsx
2026-04-29 16:55:25 +03:00

28 أسطر
665 B
TypeScript

type SectionHeadingProps = {
eyebrow: string;
title: string;
description?: string;
align?: "left" | "center";
};
export function SectionHeading({
eyebrow,
title,
description,
align = "left",
}: SectionHeadingProps) {
const alignment = align === "center" ? "mx-auto max-w-3xl text-center" : "max-w-3xl";
return (
<div className={alignment}>
<p className="section-kicker">{eyebrow}</p>
<h2 className="type-section-title mt-4 text-[var(--color-ink)]">
{title}
</h2>
{description ? (
<p className="type-body-responsive mt-5 text-[var(--color-muted)]">{description}</p>
) : null}
</div>
);
}