Header
LayoutReactTailwindResponsive header with navigation, theme toggle, and mobile bottom bar.
Desktop
Mobile bottom nav
AboutBlogCase Study
Breadcrumb
1 import { Header } from "@/shared/layout/header"; 2 3 // ─── Standalone (website style) ───────────── 4 // No props — nav items configured inside header.tsx 5 // Sticky top bar + floating bottom pill nav on mobile 6 7 <Header /> 8 9 // Configure nav items inside header.tsx 10 const navItems = [ 11 { href: "/about", label: "About" }, 12 { href: "/blog", label: "Blog" }, 13 { href: "/case-study", label: "Case Study" }, 14 ]; 15 16 // ─── Breadcrumb (website catalog only) ────── 17 // This variant is used by the /case-study catalog page, 18 // not part of the turmerrific starter kit. 19 20 import { Header as CatalogHeader } from "@/features/catalog/components/header"; 21 22 <CatalogHeader breadcrumb={[{ label: "Case Study" }, { label: "Button" }]} /> 23 24 // Renders: 🏠 > Case Study > Button About Blog Case Study 🌙 25 // Sticky top bar with breadcrumb trail + right-side nav + theme toggle