From a9c36381fcb50a19df86477f1a2948e8f209f361 Mon Sep 17 00:00:00 2001
From: zuoliangyu <87565260+zuoliangyu@users.noreply.github.com>
Date: Tue, 10 Mar 2026 09:30:52 +0800
Subject: [PATCH] fix: toolbar compact mode not triggering on Windows due to
 left-side overflow (#1375)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The toolbar container used `justify-end` which caused content to overflow
to the left side. Browser `scrollWidth` does not account for left-side
overflow, so `useAutoCompact` could never detect it and compact mode
never activated — resulting in clipped tab labels (e.g. "aude" instead
of "Claude") at minimum window width.

Fix: remove `justify-end` from the toolbar container and use `ml-auto`
on the child element instead. This keeps the right-aligned appearance
but makes overflow go rightward, where `scrollWidth` correctly detects
it and triggers compact mode.

Co-authored-by: zuolan <zuolan1102@qq.com>
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
---
 .gitignore  | 1 +
 src/App.tsx | 4 ++--
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/.gitignore b/.gitignore
index fc211bf72..bb1ef9cb3 100644
--- a/.gitignore
+++ b/.gitignore
@@ -24,3 +24,4 @@ flatpak/cc-switch.deb
 flatpak-build/
 flatpak-repo/
 .worktrees/
+.spec-workflow/
\ No newline at end of file
diff --git a/src/App.tsx b/src/App.tsx
index 76445a7d2..e4ba2eb22 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -996,10 +996,10 @@ function App() {
               )}
             <div
               ref={toolbarRef}
-              className="flex flex-1 min-w-0 overflow-x-hidden justify-end items-center"
+              className="flex flex-1 min-w-0 overflow-x-hidden items-center"
             >
               <div
-                className="flex shrink-0 items-center gap-1.5"
+                className="flex shrink-0 items-center gap-1.5 ml-auto"
                 style={{ WebkitAppRegion: "no-drag" } as any}
               >
                 {currentView === "prompts" && (