The overview card overflows its slot with three readable roots, and the footer is silently clipped #5

Open
opened 2026-09-02 12:14:27 +02:00 by thisilike · 0 comments
Owner

OVERVIEW_ROOTS = 3 does not fit the slot it is named for. Three healthy roots put the widget at 212px in a 205px slot, and .od-card > .body is overflow: hidden (core/packages/shell/src/pages/HomePage.svelte:56,69, grid-auto-rows: 276px), so the read/write · N more roots footer is cut by 7.39px with no cue that anything is missing.

Pre-existing, not from #4origin/main's widget measures the same 212 / 205 / −7.39. Found while measuring a different question on that PR.

Measured

Rendered headless on the real dashboard via the @astral/astral recipe in core/CLAUDE.md:376, against a running server with OPSDECK_FAKE_DATA=1 and six roots configured. Identical figures at a 376px card (1440 viewport) and a 360px card (380 viewport):

rows row heights widget content slot over
3 readable 55.91 × 3 212px 205px −7.39px
1 readable + 2 unreadable 55.91 / 38.52 / 38.52 205px 205px fits exactly

A readable row is 55.91px (bar 17.39 + one .meta line 16.67 + 3px margin). An unreadable row is 38.52px, because it has no bar. So the layout only fits today when at least one root is unreadable — the healthy case is the one that overflows.

Why it matters

Two invariants in the tree currently say this does not happen:

  • HomePage.svelte — "widgets must fit the slot — never show a scrollbar"
  • OVERVIEW_ROOTS's own doc comment in backend/fsops.ts:487-490, which names the slot as the reason for the number

The clip is silent, and the thing it eats is the footer that says how many roots are hidden — so the card understates its own incompleteness exactly when it is full.

Options

  1. OVERVIEW_ROOTS = 2 — fits with headroom, costs a row.
  2. Shrink the readable row: drop the bar's margin, or put usage on the same line as the name.
  3. Raise the slot: grid-auto-rows in HomePage.svelte, which affects every widget, not just this one.

Whichever way it goes, a rendering test that measures content against slot height would keep it from drifting back — that is the check OVERVIEW_ROOTS's comment currently asks a reader to perform by hand.

Also noticed

OverviewWidget.svelte:141's CSS comment says "the slot is 260px wide". It measures 322px at a 360px card, and .why never ellipsises at either width (clientWidth 322 == scrollWidth 322). Stale comment, no behaviour attached.

`OVERVIEW_ROOTS = 3` does not fit the slot it is named for. Three healthy roots put the widget at **212px** in a **205px** slot, and `.od-card > .body` is `overflow: hidden` (`core/packages/shell/src/pages/HomePage.svelte:56,69`, `grid-auto-rows: 276px`), so the `read/write · N more roots` footer is cut by **7.39px** with no cue that anything is missing. Pre-existing, not from #4 — `origin/main`'s widget measures the same 212 / 205 / −7.39. Found while measuring a different question on that PR. ## Measured Rendered headless on the real dashboard via the `@astral/astral` recipe in `core/CLAUDE.md:376`, against a running server with `OPSDECK_FAKE_DATA=1` and six roots configured. Identical figures at a 376px card (1440 viewport) and a 360px card (380 viewport): | rows | row heights | widget content | slot | over | | --- | --- | --- | --- | --- | | 3 readable | 55.91 × 3 | 212px | 205px | −7.39px | | 1 readable + 2 unreadable | 55.91 / 38.52 / 38.52 | 205px | 205px | fits exactly | A readable row is 55.91px (bar 17.39 + one `.meta` line 16.67 + 3px margin). An unreadable row is 38.52px, because it has no bar. So the layout only fits today when at least one root is unreadable — the healthy case is the one that overflows. ## Why it matters Two invariants in the tree currently say this does not happen: - `HomePage.svelte` — "widgets must fit the slot — never show a scrollbar" - `OVERVIEW_ROOTS`'s own doc comment in `backend/fsops.ts:487-490`, which names the slot as the reason for the number The clip is silent, and the thing it eats is the footer that says how many roots are hidden — so the card understates its own incompleteness exactly when it is full. ## Options 1. `OVERVIEW_ROOTS = 2` — fits with headroom, costs a row. 2. Shrink the readable row: drop the bar's margin, or put usage on the same line as the name. 3. Raise the slot: `grid-auto-rows` in `HomePage.svelte`, which affects every widget, not just this one. Whichever way it goes, a rendering test that measures content against slot height would keep it from drifting back — that is the check `OVERVIEW_ROOTS`'s comment currently asks a reader to perform by hand. ## Also noticed `OverviewWidget.svelte:141`'s CSS comment says "the slot is 260px wide". It measures 322px at a 360px card, and `.why` never ellipsises at either width (`clientWidth 322 == scrollWidth 322`). Stale comment, no behaviour attached.
Sign in to join this conversation.
No labels
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference
OpsDeck/module_filebrowser#5
No description provided.