diff --git a/css/style.css b/css/style.css index 6b477d7..f175871 100644 --- a/css/style.css +++ b/css/style.css @@ -785,12 +785,17 @@ input[type="range"]::-webkit-slider-thumb { the scrollport edge. Everything else that sticks (batch bar, pagination, table header) offsets by --hdr-h. */ .content-header { - display: flex; align-items: baseline; gap: 12px; margin-bottom: 20px; - /* FIXED, not min-height: 24px of padding + 38px of bar. A minimum still - lets a child grow the row — a couple of stray pixels from the selection - bar were enough to push the whole grid down in table and list view. With - a fixed height nothing inside can move what follows. */ - height: 62px; + display: flex; align-items: baseline; gap: 12px; + /* padding, NOT margin: offsetHeight (which feeds --hdr-h, where the sticky + pagination parks) ignores margins, so the 20px gap vanished as soon as + the header stuck. As padding it is measured AND painted — the gap stays + constant and stays opaque instead of letting rows scroll through it. */ + padding-bottom: 20px; + /* FIXED, not min-height: 24 top padding + 38 bar + 20 bottom padding. A + minimum still lets a child grow the row — a couple of stray pixels from + the selection bar were enough to push the whole grid down in table and + list view. With a fixed height nothing inside can move what follows. */ + height: 82px; position: sticky; top: 0; z-index: 12; background: var(--bg); padding-top: 24px; @@ -2682,7 +2687,7 @@ body[data-editor-position="center"]:has(#settingsPanel.is-open)::before { .nav-item { justify-content: center; padding: 8px; } .topbar { padding: 12px 16px; } .content { padding: 0 16px 16px; } - .content-header { padding-top: 16px; height: 54px; } /* 16 + 38 */ + .content-header { padding-top: 16px; height: 74px; } /* 16 + 38 + 20 */ .slideover { width: 100%; } /* On a narrow viewport the slideover fills the screen — no point pushing the shell, the table isn't visible anyway. */