Fix #276: settings nav stacks on narrow

crueber commented

2026-09-10 12:49:52 +00:00

Owner

Below sm: the settings nav sections now stack full-width above the content, each with its own internally-scrolling chip bar (was: side-by-side sections squeezing the standard bar to ~230px at 390px). sm:-lg: keeps side-by-side rows; lg:+ stays the sticky sidebar. Danger section gains min-w-0, nav gains min-w-0, li entries are flex-none chips. Native buttons + aria-current active styling unchanged (keyboard flow, dark + light).

Verification (transient local headless_shell + loopback test server, both killed after; shared daemon untouched):

390px, all 10 tabs x dark/light: sections 358px full-width stacked; standard bar scrolls internally (clientW 358 / scrollW 893); 10/10 buttons natively focusable, Tab order in DOM order; WAL chip scrolls into view (909 -> 324..374); active tab distinct bg both themes, follows #hash.
Settings shell + tab content contribute ZERO page-level overflow: with shared chrome hidden, shellOnly=390 exactly (general/config/danger).
Page docW stays 552 from out-of-scope shared chrome owned by #274 (repo tab bar, Settings link R552) and #273 (site-header cluster R447) — separate open issues, untouched here.
Console: clean per settled tab load; only line is the by-design mirror-endpoint 404 on non-mirror repos (MirrorTab tolerates it; pre-existing, unrelated).
node --test 548/548 green; vite build green. No backend/SDK/API change; no new deps.

Below sm: the settings nav sections now stack full-width above the content, each with its own internally-scrolling chip bar (was: side-by-side sections squeezing the standard bar to ~230px at 390px). sm:-lg: keeps side-by-side rows; lg:+ stays the sticky sidebar. Danger section gains min-w-0, nav gains min-w-0, li entries are flex-none chips. Native buttons + aria-current active styling unchanged (keyboard flow, dark + light). Verification (transient local headless_shell + loopback test server, both killed after; shared daemon untouched): - 390px, all 10 tabs x dark/light: sections 358px full-width stacked; standard bar scrolls internally (clientW 358 / scrollW 893); 10/10 buttons natively focusable, Tab order in DOM order; WAL chip scrolls into view (909 -> 324..374); active tab distinct bg both themes, follows #hash. - Settings shell + tab content contribute ZERO page-level overflow: with shared chrome hidden, shellOnly=390 exactly (general/config/danger). - Page docW stays 552 from out-of-scope shared chrome owned by #274 (repo tab bar, Settings link R552) and #273 (site-header cluster R447) — separate open issues, untouched here. - Console: clean per settled tab load; only line is the by-design mirror-endpoint 404 on non-mirror repos (MirrorTab tolerates it; pre-existing, unrelated). - node --test 548/548 green; vite build green. No backend/SDK/API change; no new deps.

crueber added 1 commit

2026-09-10 12:49:53 +00:00

Fix #276 : settings nav stacks as full-width chip bars below sm: (12_web_ui) c9c0c00be5

crueber referenced this pull request

2026-09-10 12:49:57 +00:00

Mobile: settings sidebar pushes nav items off-screen (not stacked/chipped on narrow widths) #276

crueber referenced this pull request

2026-09-10 13:05:28 +00:00

Mobile: settings sidebar pushes nav items off-screen (not stacked/chipped on narrow widths) #276

crueber merged commit b074697561 into main

2026-09-10 13:06:42 +00:00

crueber referenced this pull request