maro
45261a0461
- Next.js 16 App Router site with the ANOUMA design system - Payload CMS (PostgreSQL) for offers, events, posts and page content - WebRTC video-call system with custom signaling server - SMTP email reminders and booking-request notifications - Customer accounts, calendar-based availability, and booking workflow
34 lines
1.0 KiB
TypeScript
34 lines
1.0 KiB
TypeScript
import Link from "next/link";
|
|
|
|
export type Crumb = { title: string; href?: string };
|
|
|
|
export function Breadcrumbs({ items }: { items: Crumb[] }) {
|
|
return (
|
|
<nav aria-label="Breadcrumb" className="mb-6">
|
|
<ol className="flex flex-wrap items-center gap-2 text-sm text-anouma-plum/80">
|
|
<li>
|
|
<Link href="/" className="hover:text-anouma-mauve-dark">
|
|
Startseite
|
|
</Link>
|
|
</li>
|
|
{items.map((item, i) => (
|
|
<li key={item.title} className="flex items-center gap-2">
|
|
<span aria-hidden="true" className="text-anouma-taupe">
|
|
/
|
|
</span>
|
|
{item.href && i !== items.length - 1 ? (
|
|
<Link href={item.href} className="hover:text-anouma-mauve-dark">
|
|
{item.title}
|
|
</Link>
|
|
) : (
|
|
<span aria-current="page" className="text-anouma-plum">
|
|
{item.title}
|
|
</span>
|
|
)}
|
|
</li>
|
|
))}
|
|
</ol>
|
|
</nav>
|
|
);
|
|
}
|