From 04f370999c1932956f37aaab2acb0926fc0b3fba Mon Sep 17 00:00:00 2001
From: enricobuehler <buehler@unom.io>
Date: Fri, 3 Jul 2026 12:09:52 +0000
Subject: [PATCH] fix(web): pin the sidebar at viewport height
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Sticky h-dvh sidebar: long pages scroll the content, not the nav — the flex
stretch was pushing the language switcher below the fold; overflow-y-auto keeps
the nav usable on short viewports.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 web/src/components/app-shell.tsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/web/src/components/app-shell.tsx b/web/src/components/app-shell.tsx
index cb45e68..546733b 100644
--- a/web/src/components/app-shell.tsx
+++ b/web/src/components/app-shell.tsx
@@ -33,8 +33,11 @@ export function AppShell({ children }: { children: ReactNode }) {
 	useLocale();
 	return (
 		<div className="flex min-h-screen">
-			{/* Desktop sidebar (≥ sm). */}
-			<aside className="hidden w-60 shrink-0 flex-col border-r bg-card/40 p-4 sm:flex">
+			{/* Desktop sidebar (≥ sm). Sticky at viewport height: the page (body) scrolls with
+			    long content, but the sidebar stays pinned — the explicit h-dvh stops the flex
+			    stretch that would otherwise grow it (and push the language switcher) below the
+			    fold. overflow-y-auto lets the nav itself scroll on very short viewports. */}
+			<aside className="sticky top-0 hidden h-dvh w-60 shrink-0 flex-col overflow-y-auto border-r bg-card/40 p-4 sm:flex">
 				<Link
 					to="/"
 					aria-label="punktfunk"