From 282a978ecfa8de04accf5ae8f80214282785cad3 Mon Sep 17 00:00:00 2001
From: falkoro <39274208+falkoro@users.noreply.github.com>
Date: Sat, 30 May 2026 16:00:27 +0200
Subject: [PATCH] Shell-tabs: fill the full bar, fewer rows

The session-switcher tabs used a fixed auto-fit grid (minmax up to 720px on wide
screens), so 7 tabs became a 3x3-ish grid with a sparse last row wasting the
bottom-right. Switch to flex-wrap + flex-grow so partial rows stretch to fill the
full width and the bar collapses to ~1 row, and trim tab height a touch.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 public/app.css | 12 +++++-------
 1 file changed, 5 insertions(+), 7 deletions(-)

diff --git a/public/app.css b/public/app.css
index 88724b3..72c3b7f 100644
--- a/public/app.css
+++ b/public/app.css
@@ -93,9 +93,9 @@ button:disabled{opacity:.48;cursor:not-allowed}
 .image-chip code{font-size:12px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .image-chip span{color:var(--muted);font-size:11px}
 .terminal-panel{border-color:rgba(139,246,255,.32)}
-.shell-tabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:7px;overflow:visible;padding:0 0 10px;margin-top:-2px;align-items:stretch;scrollbar-width:none}
+.shell-tabs{display:flex;flex-wrap:wrap;gap:7px;overflow:visible;padding:0 0 10px;margin-top:-2px;align-items:stretch;scrollbar-width:none}
 .shell-tabs::-webkit-scrollbar{display:none}
-.shell-tabs button{width:100%;min-height:52px;padding:7px 10px;font-size:13px}
+.shell-tabs button{flex:1 1 280px;width:auto;min-height:46px;padding:6px 10px;font-size:13px}
 .shell-tabs button.session-tab{display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:8px;min-width:0;max-width:none;text-align:left}
 .shell-tabs button.session-tab.no-summary{min-width:0;max-width:none}
 .shell-tabs button.selected{border-color:rgba(139,246,255,.7);background:#10202b}
@@ -201,17 +201,15 @@ body.preview-fullscreen-open{overflow:hidden}
 .terminal-card.agent-waiting{border-color:rgba(255,200,87,.5)}
 @media (min-width:1700px){
   .workspace{grid-template-columns:360px minmax(0,1fr)}
-  .shell-tabs{grid-template-columns:repeat(auto-fit,minmax(380px,1fr))}
+  .shell-tabs button{flex-basis:300px}
 }
 @media (min-width:2400px){
   .workspace{grid-template-columns:380px minmax(0,1fr)}
-  .shell-tabs{grid-template-columns:repeat(auto-fit,minmax(560px,1fr))}
-  .shell-tabs button{min-height:58px}
+  .shell-tabs button{flex-basis:340px;min-height:50px}
 }
 @media (min-width:3200px){
   .workspace{grid-template-columns:400px minmax(0,1fr)}
-  .shell-tabs{grid-template-columns:repeat(auto-fit,minmax(720px,1fr))}
-  .shell-tabs button{min-height:62px}
+  .shell-tabs button{flex-basis:420px;min-height:54px}
 }
 /* Quick links panel (sidebar, under Sessions) */
 .links-panel .panel-header{margin-bottom:10px}