From c7f3bf25d19d7dc46e17935644996e0c6fed7002 Mon Sep 17 00:00:00 2001
From: josh <josh@thewrightserver.net>
Date: Sun, 3 May 2026 22:14:45 -0400
Subject: [PATCH] Bins: fixed N-column grid per letter group

The bins-by-letter grid used auto-fill with a 380px minimum, so a row
of A1-A6 wrapped once the viewport got tight, and rows with fewer
bins than the auto-fill column count left empty tracks on the right.

Switch to repeat(N, minmax(0, 1fr)) where N is the number of bins in
the group: cards smush to fit so a letter never wraps to a second
visual row, and minmax(0, 1fr) lets columns share whatever width is
available so a sparse row (e.g. C with 2 bins) widens to fill the
line just as a dense row does.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 web/src/views/BinsView.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/src/views/BinsView.tsx b/web/src/views/BinsView.tsx
index 99a04df..f6a3afc 100644
--- a/web/src/views/BinsView.tsx
+++ b/web/src/views/BinsView.tsx
@@ -102,7 +102,7 @@ export function BinsView({
           <div
             style={{
               display: "grid",
-              gridTemplateColumns: "repeat(auto-fill, minmax(380px, 1fr))",
+              gridTemplateColumns: `repeat(${bins.length}, minmax(0, 1fr))`,
               gap: 14,
             }}
           >