From 8813bfd2f56927f0b06d94a033c39c6ebcb294e3 Mon Sep 17 00:00:00 2001
From: Andy Bonventre <andybons@meetneptune.com>
Date: Wed, 15 Jul 2026 12:05:15 -0400
Subject: [PATCH] fix(nav): align sidebar order numbers to the first line of
 wrapped titles

The number/title flex row used items-center, so on titles that wrap to
2-3 lines the number floated to the vertical middle of the block instead
of sitting on the first line. Switch to items-baseline and pin the
number column to a fixed, non-shrinking width with tabular-nums so all
titles start at the same x-position regardless of wrapping.
---
 src/components/NavLink.astro | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/NavLink.astro b/src/components/NavLink.astro
index 69d8771..1fa56c6 100644
--- a/src/components/NavLink.astro
+++ b/src/components/NavLink.astro
@@ -14,13 +14,13 @@ const isActive = currentPath.includes(href);
     href={href}
     aria-current={isActive ? "page" : undefined}
     class:list={[
-      "flex items-center gap-2 py-2 text-sm border-l-2 transition-colors focus-visible:outline-2 focus-visible:outline-sky-600 focus-visible:outline-offset-2",
+      "flex items-baseline gap-2 py-2 text-sm border-l-2 transition-colors focus-visible:outline-2 focus-visible:outline-sky-600 focus-visible:outline-offset-2",
       isActive
         ? "text-stone-800 dark:text-stone-300 bg-stone-100 dark:bg-stone-900 border-transparent -mx-4 md:-mx-6 px-4 md:px-6"
         : "text-stone-600 dark:text-stone-400 border-transparent hover:text-stone-800 dark:hover:text-stone-300 px-0"
     ]}
   >
-    <span class="text-[10px] text-stone-600 dark:text-stone-500 w-6">{number}</span>
+    <span class="text-[10px] text-stone-600 dark:text-stone-500 w-6 shrink-0 tabular-nums">{number}</span>
     <slot />
   </a>
 </li>