30 lines
1.5 KiB
Markdown
30 lines
1.5 KiB
Markdown
## Why
|
|
|
|
The base layout shell (step 002) includes stub `Nav.astro` and `Footer.astro` components that render nothing. Every page is unusable without navigation — users can't move between pages, switch languages, or reach the contact CTA. Step 003 fills in the navigation bar, the primary wayfinding element present on every page of the site.
|
|
|
|
## What Changes
|
|
|
|
- **`src/components/Nav.astro`** — implement the full responsive navigation bar (currently an empty stub)
|
|
- **`src/content/en.json`** — add `nav` key with link labels and CTA text
|
|
- **`src/content/nl.json`** — add `nav` key with Dutch equivalents
|
|
- No changes to `BaseLayout.astro` — it already imports `Nav.astro`
|
|
|
|
## Capabilities
|
|
|
|
### New Capabilities
|
|
|
|
- `navigation`: Responsive nav bar with logo, page links, language switcher, and Connect CTA. Transparent on load, solid Midnight background on scroll. Mobile hamburger menu with slide-in drawer.
|
|
|
|
### Modified Capabilities
|
|
|
|
- `content-i18n`: Add `nav` section to both `en.json` and `nl.json` content files (new keys, no requirement changes to the existing meta section or the i18n helper).
|
|
|
|
## Impact
|
|
|
|
- `website/src/components/Nav.astro` — full implementation replaces stub
|
|
- `website/src/content/en.json` — new `nav` key added
|
|
- `website/src/content/nl.json` — new `nav` key added
|
|
- Vanilla JS `<script>` tag in Nav handles scroll behavior and mobile menu toggle — no external dependencies
|
|
- No SEO impact (nav is not indexed content, no structured data changes)
|
|
- All pages that use `BaseLayout` automatically get the nav (no per-page changes needed)
|