Navbar01

File: src/blocks/navbar/Navbar01.astro

Sticky site header with desktop links, mobile slide-out menu, optional CTA, and theme toggle. Wired in BaseLayout.astro. Floating alternative: Navbar02.

Config (identity.ts → navigation)

navigation: {
  sticky: true,
  links: [
    { label: "Work", href: "/work/" },
    { label: "About", href: "/about/" },
    { label: "Contact", href: "/contact/" },
  ],
  cta: { label: "Hire me", href: "/contact/", size: "sm" },
},

Logo paths and site name come from identity (name, logo assets).

Add to a page

Usually via BaseLayout. For a one-off:

---
import Navbar01 from "@/blocks/navbar/Navbar01.astro";
---

<Navbar01
  links={[
    { label: "Home", href: "/" },
    { label: "Work", href: "/work/" },
  ]}
  ctaLabel="Contact"
  ctaHref="/contact/"
  sticky={false}
/>

Props

Mobile: hamburger + slide panel below md. CTA shows in the panel on small screens.

← Navbar versions · Blocks overview