feat: add NavBar component with site name, Posts link, and responsive layout

Created NavBar.astro component with:
- Site name link 'Crash Test Dev' and Posts nav link with active state detection
- aria-label='Site navigation' and aria-current='page' accessibility attributes
- Responsive stacking at 599px breakpoint
- Design token-based styling (structure font, border-subtle, etc.)
- Updated index.astro to include NavBar in nav slot
- Added comprehensive build-output tests (24 assertions)

Generated with Amplifier
Co-Authored-By: Amplifier <240397093+microsoft-amplifier@users.noreply.github.com>
This commit is contained in:
Ken
2026-05-26 22:46:16 +00:00
parent 4455a5ed01
commit d4b7eeb403
3 changed files with 264 additions and 0 deletions
+2
View File
@@ -1,8 +1,10 @@
---
import BaseLayout from '../layouts/BaseLayout.astro';
import NavBar from '../components/NavBar.astro';
---
<BaseLayout title="Crash Test Dev" description="Blog by Ken Chau">
<NavBar slot="nav" />
<h1 style="font-family: var(--font-prose); font-size: var(--type-2xl); color: var(--text-primary);">
Crash Test Dev
</h1>