From b1667513bd00168a937048a2ef616efefd653a28 Mon Sep 17 00:00:00 2001
From: Aleksander Grygier <aleksander.grygier@gmail.com>
Date: Fri, 21 Aug 2026 15:14:44 +0200
Subject: [PATCH] chat : adjust tab bar width and use a shared offset variable

Widen the tab bar for the expanded sidebar and rename the tab bar height
variable to --chat-tabs-offset with a smaller value so the chat screen
min-height accounts for the overlay without overshooting.

Assisted-by: pi
---
 .../src/lib/components/app/chat/ChatScreen/ChatScreen.svelte  | 2 +-
 tools/ui/src/lib/components/app/chat/ChatTabs/ChatTabs.svelte | 4 ++--
 tools/ui/src/routes/(chat)/+layout.svelte                     | 2 +-
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/tools/ui/src/lib/components/app/chat/ChatScreen/ChatScreen.svelte b/tools/ui/src/lib/components/app/chat/ChatScreen/ChatScreen.svelte
index bb18bae50f..b5e00ca7d5 100644
--- a/tools/ui/src/lib/components/app/chat/ChatScreen/ChatScreen.svelte
+++ b/tools/ui/src/lib/components/app/chat/ChatScreen/ChatScreen.svelte
@@ -298,7 +298,7 @@
 	<ServerLoadingSplash />
 {:else}
 	<div
-		class="chat-screen flex grow flex-col min-h-[calc(100dvh-1rem)] md:min-h-[calc(100dvh-1rem-var(--chat-tabs-height,0px))] px-4 md:py-0 pt-12 pb-48 md:pb-4"
+		class="chat-screen flex grow flex-col min-h-[calc(100dvh-1rem)] md:min-h-[calc(100dvh-1rem-var(--chat-tabs-offset,0px))] px-4 md:py-0 pt-12 pb-48 md:pb-4"
 		style:--chat-form-bottom-position={chatFormBottomPosition}
 		ondragenter={dragAndDrop.dragHandlers.dragenter}
 		ondragleave={dragAndDrop.dragHandlers.dragleave}
diff --git a/tools/ui/src/lib/components/app/chat/ChatTabs/ChatTabs.svelte b/tools/ui/src/lib/components/app/chat/ChatTabs/ChatTabs.svelte
index 288d04e42e..461d483a99 100644
--- a/tools/ui/src/lib/components/app/chat/ChatTabs/ChatTabs.svelte
+++ b/tools/ui/src/lib/components/app/chat/ChatTabs/ChatTabs.svelte
@@ -74,8 +74,8 @@
 
 <nav
 	class="group sticky pl-1 top-0 z-10 hidden md:block chat-tabs-fade transition-[padding] duration-200 ease-in-out pt-3.25 {uiStore.isSidebarExpanded
-		? 'max-w-[calc(100vw-19.5rem)]'
-		: 'max-w-[calc(100vw-4.5rem)]'}"
+		? 'max-w-[calc(100vw-20rem)]'
+		: 'max-w-[calc(100vw-5rem)]'}"
 	aria-label="Open conversations"
 >
 	<div class="relative">
diff --git a/tools/ui/src/routes/(chat)/+layout.svelte b/tools/ui/src/routes/(chat)/+layout.svelte
index 9f943626a9..43f5fe9708 100644
--- a/tools/ui/src/routes/(chat)/+layout.svelte
+++ b/tools/ui/src/routes/(chat)/+layout.svelte
@@ -25,7 +25,7 @@
 	});
 </script>
 
-<div class={showTabs ? 'md:[--chat-tabs-height:2.5rem]' : ''}>
+<div class={showTabs ? 'md:[--chat-tabs-offset:1.25rem]' : ''}>
 	{#if showTabs}
 		<ChatTabs />
 	{/if}