From ba1a29d12affe5faef3595e5e6a5d85bcdcdc528 Mon Sep 17 00:00:00 2001 From: jay Date: Thu, 11 Jun 2026 20:57:37 -0400 Subject: [PATCH] Admin Sources: constrained scroll panel with sticky header MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The sources table scrolled horizontally but had no height cap, so its horizontal scrollbar sat at the bottom of a 46-row table — you had to page the whole window down to reach it. Make .tablewrap a self-contained scroll panel (max-height 65vh, overflow auto, bordered card) so both scrollbars stay on-screen; pin the header row sticky (box-shadow divider survives position:sticky under border-collapse). Co-Authored-By: Claude Opus 4.8 --- frontend/src/routes/admin/+page.svelte | 16 ++++++++++++++-- 1 file changed, 14 insertions(+), 2 deletions(-) diff --git a/frontend/src/routes/admin/+page.svelte b/frontend/src/routes/admin/+page.svelte index 9831e7f..90062cb 100644 --- a/frontend/src/routes/admin/+page.svelte +++ b/frontend/src/routes/admin/+page.svelte @@ -1075,11 +1075,23 @@ .cactions .cchk { font-size: 0.8rem; color: var(--muted); display: inline-flex; align-items: center; gap: 5px; } /* Source health table */ - .tablewrap { overflow-x: auto; } + /* Constrained scroll box: the table scrolls BOTH ways inside its own panel, so + the horizontal scrollbar stays on-screen instead of living at the bottom of a + 46-row table you'd have to page down to reach. Header row stays sticky. */ + .tablewrap { + max-height: 65vh; overflow: auto; + border: 1px solid var(--line); border-radius: 12px; background: var(--surface); + } .srctable { width: 100%; border-collapse: collapse; font-size: 0.86rem; min-width: 560px; } + .srctable thead th { + position: sticky; top: 0; z-index: 1; background: var(--surface); + /* box-shadow draws the divider reliably under position:sticky (a plain + border-bottom can drop out while scrolling with border-collapse). */ + box-shadow: inset 0 -1px 0 var(--line); + } .srctable th { text-align: left; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.06em; - color: var(--muted); font-weight: 600; padding: 6px 10px; border-bottom: 1px solid var(--line); + color: var(--muted); font-weight: 600; padding: 8px 10px; } .srctable td { padding: 8px 10px; border-bottom: 1px solid var(--line); vertical-align: baseline; } .srctable .num { text-align: right; font-variant-numeric: tabular-nums; }