From ba6d18e9d026ae12f1162326f3e48dbc2f9bbd4b Mon Sep 17 00:00:00 2001
From: Owen McGirr <owenmcgirr@Owens-Mac-Studio-2.local>
Date: Wed, 23 Sep 2026 08:56:35 +0100
Subject: [PATCH] Left-align desktop sidebar navigation

---
 src/App.tsx    | 2 +-
 src/ui/app.css | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 30fd6847..2433f617 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -43,7 +43,7 @@ const bluetoothDescriptions: Record<AppState["bluetooth"], string> = {
 };
 
 function NavButton({ active, icon, children, onClick }: { active: boolean; icon: ReactNode; children: ReactNode; onClick: () => void }) {
-  return <Button className="nav-button" data-active={active} onClick={onClick}>{icon}<span>{children}</span></Button>;
+  return <Button className="nav-button [@media(width>800px)]:justify-start" data-active={active} onClick={onClick}>{icon}<span>{children}</span></Button>;
 }
 
 function StatusIcon({ ok, children }: { ok: boolean; children: ReactNode }) {
diff --git a/src/ui/app.css b/src/ui/app.css
index 2b1710e0..3bf23ce3 100644
--- a/src/ui/app.css
+++ b/src/ui/app.css
@@ -11,7 +11,7 @@
   .app-shell { grid-template-columns: 240px minmax(0, 1fr); }
   .app-shell aside { @apply gap-3; overflow-y: auto; }
   .app-shell nav { @apply gap-3; }
-  .app-shell .nav-button { @apply justify-start text-left; }
+  .app-shell .nav-button { @apply text-left; }
   .view { width: min(100%, 1100px); @apply px-8 py-8; }
   .page-header { @apply mb-6; }
   .page-header h1 { @apply text-3xl; }