From 46c14633ac461695121c34d3b8bf837319e4174e Mon Sep 17 00:00:00 2001 From: heyitsStylez Date: Thu, 7 May 2026 12:40:39 +0800 Subject: [PATCH] Fix: min-width on outcome treemap cells so small buckets stay readable MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit When one outcome dominates (e.g. 28 EXPIRED vs 1 ASSIGNED), proportional flex sizing crushed the small cells to ~30px and truncated their labels. Set min-width:110px so each cell reserves room for "OUTCOME · count · $prem" while EXPIRED still visually dominates. Co-Authored-By: Claude Opus 4.7 --- src/css/styles.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/css/styles.css b/src/css/styles.css index 2e257ed..835cd4d 100644 --- a/src/css/styles.css +++ b/src/css/styles.css @@ -760,7 +760,7 @@ td.td-act { width:1px; white-space:nowrap; padding-right:12px; } .outchart-meta{display:flex;justify-content:space-between;align-items:baseline;font-size:.55rem;letter-spacing:1.2px;color:var(--mu);text-transform:uppercase;margin-bottom:8px} .outchart-meta b{color:var(--text);font-size:.85rem;font-weight:700;letter-spacing:0;text-transform:none;font-variant-numeric:tabular-nums} .outchart-treemap{display:flex;width:100%;height:140px;border:1px solid var(--bd2);background:var(--s2);overflow:hidden;gap:2px} -.outchart-cell{display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;color:var(--bg);font-weight:700;transition:filter .15s,opacity .15s;padding:8px;overflow:hidden;text-align:center;min-width:0} +.outchart-cell{display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;color:var(--bg);font-weight:700;transition:filter .15s,opacity .15s;padding:8px;overflow:hidden;text-align:center;min-width:110px} .outchart-cell:hover{filter:brightness(1.15)} .outchart-cell.active{outline:2px solid var(--text);outline-offset:-2px} .outchart-cell.dim{opacity:.45}