Thanh Quy - wolf
41 lines
1.5 KiB
TypeScript
41 lines
1.5 KiB
TypeScript
import Image from "next/image";
|
|
import Link from "next/link";
|
|
|
|
import type { FeedLayoutProps } from "./FeedLayout.types";
|
|
|
|
/**
|
|
* Feed layout template — custom minimal header (Drinkool brand, no auth button).
|
|
* Used by the (feed) route group.
|
|
*/
|
|
export default function FeedLayout({ children }: FeedLayoutProps) {
|
|
return (
|
|
<>
|
|
{/* Custom Drinkool header — no login button */}
|
|
<header className="sticky top-0 z-50 h-(--spacing-header-height) w-full border-b border-(--color-border) bg-(--color-bg-header) shadow-[0_1px_8px_var(--color-shadow-sm)]">
|
|
<div className="mx-auto flex h-full max-w-screen-2xl items-center gap-4 px-6 md:px-8 lg:px-12">
|
|
<Link
|
|
href="/feed"
|
|
className="group flex shrink-0 items-center gap-3 no-underline"
|
|
>
|
|
<div className="relative h-10 w-10 shrink-0 md:h-11 md:w-11">
|
|
<Image
|
|
src="/imgs/logo.png"
|
|
alt="Logo Drinkool"
|
|
fill
|
|
className="object-contain transition-transform duration-200 group-hover:scale-105"
|
|
sizes="44px"
|
|
priority
|
|
/>
|
|
</div>
|
|
<span className="text-lg font-bold text-(--color-primary-dark) transition-colors duration-150 group-hover:text-(--color-primary) md:text-xl">
|
|
Drinkool
|
|
</span>
|
|
</Link>
|
|
</div>
|
|
</header>
|
|
|
|
<div className="flex-1">{children}</div>
|
|
</>
|
|
);
|
|
}
|