[Phase 03] Header: nav, dropdowns, theme toggle, mobile

[ashleyshaw]

Phase 03 — Header component

Implements the full site header: sticky nav bar, Browse + Resources dropdowns,
theme toggle (single icon — moon/sun), search trigger pill, mobile header with
3 icons (theme + search + burger), and the right-side slide-in drawer.

Deliverables

• src/components/Header.astro — full header markup + scoped styles
• src/scripts/header.js — burger, drawer, dropdowns, theme toggle, scroll-shrink
• src/scripts/theme-toggle.js — theme init + toggle logic
• Header wired into BaseLayout.astro
• Mobile: theme icon + search icon + burger (all three visible ≤1024px)
• Theme toggle: one icon only — moon (light) or sun (dark), never both
• Brand icon swaps Blue.svg ↔ Light-Blue.svg with theme (CSS-only, no JS)
• Scroll-shrink: nav reduces to 52px height after 60px scroll
• All tokens correct per AWESOME_GITHUB_THEME_TOKENS_SPEC.md §3.2

Spec: CLAUDE_CODE_HEADER_FOOTER_SPEC.md, CLAUDE_CODE_HEADER_V2_SPEC.md

[linear-code]

LS-946

LS-1087

[github-actions]

⚠️ This issue does not follow a required issue template.

Missing required section(s): Definition of Ready (DoR), Definition of Done (DoD)

The issue will remain open and flagged until the body is corrected.
Please update the issue with one of the official templates:

• https://github.com/lightspeedwp/.github/issues/new/choose

If this was opened by automation, update the automation to preserve the template sections before creating the issue.

[ashleyshaw]

Phase 03 complete. PR #856 opened. Theme toggle single-icon verified (JS injection, not CSS display tricks). Mobile header 3-icon layout (theme → search → burger) confirmed. Build passes — 220 pages generated with no errors.

---

Generated by Claude Code