From 125b3ffcf6f3a779194fe54bc0a2f5fe7e4d9d8c Mon Sep 17 00:00:00 2001 From: Yashas Date: Wed, 9 Sep 2026 14:17:02 +0530 Subject: [PATCH] =?UTF-8?q?console:=2060/40=20split=20on=20the=20lead=20pa?= =?UTF-8?q?ge=20=E2=80=94=20close=20the=20dead=20gap?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The rail was a fixed 340px, so the main column ballooned much wider than the feed text (capped for readability) and a dead gap opened between the narrative and the facts. Proportional split now: the AI decision stream ~60%, the customer / vehicle / document facts ~40%. The gap closes, the feed fills its column (max line length nudged 76→82ch), and the facts breathe — the PDF names stop wrapping. Co-Authored-By: Claude Opus 4.8 --- src/components/Timeline.css | 2 +- src/screens/screens.css | 15 ++++++++------- 2 files changed, 9 insertions(+), 8 deletions(-) diff --git a/src/components/Timeline.css b/src/components/Timeline.css index 8b3591a..7ded4ba 100644 --- a/src/components/Timeline.css +++ b/src/components/Timeline.css @@ -156,7 +156,7 @@ font-size: var(--fs-sm); line-height: var(--lh-normal); color: var(--zk-muted); - max-width: 76ch; + max-width: 82ch; } .tl__figs { diff --git a/src/screens/screens.css b/src/screens/screens.css index 77e1f8f..300c7cb 100644 --- a/src/screens/screens.css +++ b/src/screens/screens.css @@ -593,13 +593,14 @@ /* ---- lead: the file beside the story ---- */ .lead { display: grid; - /* THE STORY GETS THE WIDE COLUMN. The trail used to sit in a 384px gutter - with its own scrollbar while a panel of reference fields had the whole - width — exactly backwards for a product whose point is the record of - work nobody watched. Now the narrative has the measure prose needs and - the reference rail is narrow, because short key/value pairs are the one - thing a narrow column is good for. */ - grid-template-columns: minmax(0, 1fr) 340px; + /* 60 / 40. The story is the point, so it takes the larger share — but a + fixed 340px rail left the main column ballooning far wider than the feed + text, so a dead gap opened between the narrative and the facts. A + proportional split closes it: the AI decision stream gets ~60%, the + customer/vehicle/document facts ~40% (capped so it does not sprawl on an + ultra-wide monitor). The facts breathe now too — the PDF names stop + wrapping. */ + grid-template-columns: minmax(0, 3fr) minmax(320px, 2fr); gap: var(--sp-6); align-items: start; }