From 97c792a2fc4805489f04337dfbe2014fd7d4ab18 Mon Sep 17 00:00:00 2001 From: Yashas Date: Thu, 10 Sep 2026 11:12:33 +0530 Subject: [PATCH] console: the queue card fills the column beside Pipeline by stage The two cards stretch to one height and the queue rows spread to fill it, so the shorter card no longer ends in empty canvas. Co-Authored-By: Claude Fable 5.1 --- src/screens/screens.css | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/src/screens/screens.css b/src/screens/screens.css index 125f55f..d0a2fe9 100644 --- a/src/screens/screens.css +++ b/src/screens/screens.css @@ -127,8 +127,13 @@ .appr:not(.is-live) .appr__n, .appr:not(.is-live) .appr__go { color: var(--zk-grey); } /* ── Two columns: queue + distribution ──────────────────────────────────── */ -.cols { display: grid; grid-template-columns: 1fr 380px; gap: 18px; margin-bottom: 22px; align-items: start; } -.queue { padding: 4px 0 6px; } +.cols { display: grid; grid-template-columns: 1fr 380px; gap: 18px; margin-bottom: 22px; align-items: stretch; } +/* The two cards share a height; the queue's rows spread to fill it so the + shorter card never ends in a block of empty canvas. */ +.cols > .card { display: flex; flex-direction: column; } +.queue { flex: 1; display: flex; flex-direction: column; } +.queue__row { flex: 1; } +.queue { padding: 0 0 6px; } .queue__row { display: grid; grid-template-columns: 52px 1fr auto auto; gap: 14px; align-items: center; padding: 14px 20px; border-top: 1px solid var(--zk-line-soft); text-decoration: none; color: inherit;