From 936194d5ce3dbe0479dcaccabfc4d841b77c72a2 Mon Sep 17 00:00:00 2001
From: Mao Nakamoto <41178744+maonakamoto@users.noreply.github.com>
Date: Mon, 31 Aug 2026 12:27:32 +0200
Subject: [PATCH] fix(nav): the in-page nav marked the current section for the
 eye only
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The section nav tracks which section is in view via an IntersectionObserver
and expressed that as `data-active`, which is a styling hook and nothing more.
A screen-reader user got no signal about where in the page they were.

`aria-current="location"`, not `"page"`: this is a one-page site and the nav
tracks a SECTION, which is exactly what `location` means. Claiming `page`
would announce a navigation that never happens here.

No visual change — `data-active` still drives the styling.

Found by the fleet nav-contract audit, which flags a repo whose navigation
computes an active state and never announces it anywhere.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XeELB8b3N4JrT2asYL9WvE
---
 components/Nav.tsx | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/components/Nav.tsx b/components/Nav.tsx
index a8c8dfc..16fdd34 100644
--- a/components/Nav.tsx
+++ b/components/Nav.tsx
@@ -58,7 +58,16 @@ export function Nav({ t, locale }: { t: Dictionary; locale: Locale }) {
           <ul className={styles.links}>
             {NAV_IDS.map((id) => (
               <li key={id}>
-                <a href={`#${id}`} className={`micro ${styles.link}`} data-active={active === id}>
+                {/* `location`, not `page`: this is a one-page site and the nav
+                    tracks which SECTION is in view, which is exactly what
+                    aria-current="location" means. "page" would claim a
+                    navigation that never happens here. */}
+                <a
+                  href={`#${id}`}
+                  className={`micro ${styles.link}`}
+                  data-active={active === id}
+                  aria-current={active === id ? 'location' : undefined}
+                >
                   {t.nav[id]}
                 </a>
               </li>