29 lines
1006 B
TypeScript
29 lines
1006 B
TypeScript
interface PageHeroProps {
|
|
title: string
|
|
breadcrumbs?: { label: string; href: string }[]
|
|
}
|
|
|
|
export function PageHero({ title, breadcrumbs }: PageHeroProps) {
|
|
return (
|
|
<div className="bg-secondary text-secondary-foreground py-12">
|
|
<div className="container mx-auto px-4">
|
|
<h1 className="text-4xl font-bold text-center mb-4">{title}</h1>
|
|
{breadcrumbs && (
|
|
<nav className="flex items-center justify-center gap-2 text-sm">
|
|
{breadcrumbs.map((crumb, index) => (
|
|
<div key={crumb.href} className="flex items-center gap-2">
|
|
<a href={crumb.href} className="hover:underline opacity-90">
|
|
{crumb.label}
|
|
</a>
|
|
{index < breadcrumbs.length - 1 && <span className="opacity-70">»</span>}
|
|
</div>
|
|
))}
|
|
<span className="opacity-70">»</span>
|
|
<span className="font-medium">{title}</span>
|
|
</nav>
|
|
)}
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|