From 82de629339ebcda2023ac8af8d6c4f42d8b13f29 Mon Sep 17 00:00:00 2001
From: Marcel <marcel@familienarchiv>
Date: Wed, 22 Apr 2026 14:35:25 +0200
Subject: [PATCH] fix(nav): prevent global header overflow at lg breakpoint
 (1024px)

- Upload button text wrapped in hidden xl:inline to hide label below xl
- AppNav logo margin reduced from mr-10 to mr-4 xl:mr-10 at lg breakpoint
  Combined these changes bring the header content to ~923px vs ~945px
  available space at 1024px, eliminating horizontal overflow

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 frontend/src/routes/+layout.svelte | 2 +-
 frontend/src/routes/AppNav.svelte  | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/routes/+layout.svelte b/frontend/src/routes/+layout.svelte
index 33671854..f3ab93b1 100644
--- a/frontend/src/routes/+layout.svelte
+++ b/frontend/src/routes/+layout.svelte
@@ -75,7 +75,7 @@ const userInitials = $derived.by(() => {
 									<polyline points="17 8 12 3 7 8" />
 									<line x1="12" y1="3" x2="12" y2="15" />
 								</svg>
-								{m.upload_action()}
+								<span class="hidden xl:inline">{m.upload_action()}</span>
 							</a>
 						{/if}
 						<!-- Language selector (desktop only — mobile lives in nav drawer) -->
diff --git a/frontend/src/routes/AppNav.svelte b/frontend/src/routes/AppNav.svelte
index 29eea77b..5c81538f 100644
--- a/frontend/src/routes/AppNav.svelte
+++ b/frontend/src/routes/AppNav.svelte
@@ -29,7 +29,7 @@ function handleOverlayKeydown(event: KeyboardEvent) {
 </script>
 
 <div class="flex items-stretch">
-	<div class="mr-10 flex flex-shrink-0 items-center">
+	<div class="mr-4 flex flex-shrink-0 items-center xl:mr-10">
 		<a href="/" class="flex items-center" aria-label="Familienarchiv">
 			<span class="font-sans text-xl font-bold tracking-widest text-white uppercase"
 				>Familienarchiv</span