gpatruno
56 lines
1.7 KiB
TypeScript
56 lines
1.7 KiB
TypeScript
import Image from "next/image";
|
|
import Link from "next/link";
|
|
import { SITE } from "@/lib/constants";
|
|
import { isUploadAssetPath } from "@/lib/image-url";
|
|
|
|
type Props = {
|
|
logoUrl?: string;
|
|
};
|
|
|
|
export function SiteHeader({ logoUrl = SITE.logoUrl }: Props) {
|
|
return (
|
|
<header className="sticky top-0 z-50 border-b border-chocolat/10 bg-cream/95 backdrop-blur-md">
|
|
<div className="mx-auto flex max-w-6xl items-center justify-between gap-4 px-4 py-4 sm:px-6">
|
|
<Link
|
|
href="/#accueil"
|
|
className="flex items-center gap-2.5 text-lg font-bold tracking-tight text-chocolat sm:gap-3 sm:text-xl"
|
|
>
|
|
<Image
|
|
src={logoUrl}
|
|
alt=""
|
|
width={44}
|
|
height={44}
|
|
unoptimized={isUploadAssetPath(logoUrl)}
|
|
className="h-9 w-9 shrink-0 sm:h-11 sm:w-11"
|
|
priority
|
|
/>
|
|
<span>{SITE.name}</span>
|
|
</Link>
|
|
<nav className="flex flex-wrap items-center justify-end gap-2 text-sm font-medium text-chocolat/90 sm:gap-6">
|
|
<Link href="/#menu" className="rounded-full px-3 py-1.5 hover:bg-gaufre/15">
|
|
Menu
|
|
</Link>
|
|
<Link
|
|
href="/#ou-me-trouver"
|
|
className="rounded-full px-3 py-1.5 hover:bg-gaufre/15"
|
|
>
|
|
Où me trouver
|
|
</Link>
|
|
<Link
|
|
href="/#galerie"
|
|
className="rounded-full px-3 py-1.5 hover:bg-gaufre/15"
|
|
>
|
|
Galerie
|
|
</Link>
|
|
<Link
|
|
href="/#infos"
|
|
className="rounded-full px-3 py-1.5 hover:bg-gaufre/15"
|
|
>
|
|
Infos
|
|
</Link>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|