From 3179fa10cf6b30d5bb2acffe8510af16acb6291a Mon Sep 17 00:00:00 2001 From: Till JS Date: Mon, 20 Apr 2026 16:03:26 +0200 Subject: [PATCH] fix(page-shell): keep header title on one line with ellipsis Narrow pages (e.g. AI Workbench at 320px) wrapped the title onto two lines because .header-left lacked min-width: 0 and .page-title had no truncation rules. Add flex shrink + nowrap + text-overflow: ellipsis. Co-Authored-By: Claude Opus 4.7 (1M context) --- .../web/src/lib/components/page-carousel/PageShell.svelte | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/apps/mana/apps/web/src/lib/components/page-carousel/PageShell.svelte b/apps/mana/apps/web/src/lib/components/page-carousel/PageShell.svelte index c0827b2f1..7325c78b4 100644 --- a/apps/mana/apps/web/src/lib/components/page-carousel/PageShell.svelte +++ b/apps/mana/apps/web/src/lib/components/page-carousel/PageShell.svelte @@ -347,6 +347,9 @@ display: flex; align-items: center; gap: 0.3rem; + flex: 1 1 auto; + min-width: 0; + overflow: hidden; } .header-icon { flex-shrink: 0; @@ -365,6 +368,10 @@ font-weight: 600; color: hsl(var(--color-foreground)); transform: translateY(1px); + min-width: 0; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } a.page-title-link { text-decoration: none;