29 lines
1010 B
TypeScript
29 lines
1010 B
TypeScript
import { HeroContentMotion, HeroMotionItem, HeroShell, HeroTitle } from "@/components/layout/site-hero";
|
|
|
|
type PageHeroProps = {
|
|
title: string;
|
|
description?: string;
|
|
};
|
|
|
|
export function PageHero({ title, description }: PageHeroProps) {
|
|
return (
|
|
<HeroShell compactBackdrop variant="page">
|
|
<HeroContentMotion variant="page">
|
|
<HeroMotionItem variant="page">
|
|
<p className="inline-flex items-center rounded-pill border border-border/70 bg-background/75 px-4 py-2 text-sm font-medium tracking-[-0.01em] text-foreground/82 shadow-xs backdrop-blur-chrome">
|
|
{title}
|
|
</p>
|
|
</HeroMotionItem>
|
|
<HeroTitle lines={[{ text: title }]} variant="page" />
|
|
{description ? (
|
|
<HeroMotionItem variant="page">
|
|
<p className="mx-auto mt-6 max-w-[34rem] text-base leading-7 text-foreground/72">
|
|
{description}
|
|
</p>
|
|
</HeroMotionItem>
|
|
) : null}
|
|
</HeroContentMotion>
|
|
</HeroShell>
|
|
);
|
|
}
|