feat(#389): mobile wave A — phone navigation shell #520

Merged

Cordy merged 8 commits from fix-389a into main

2026-09-13 18:21:16 +00:00

Cordy commented

2026-09-13 18:20:09 +00:00

Owner

Wave A of the #389 mobile pass, per the approved mockup and the decisions recorded on the issue (bottom tab bar; functional admin; star+kebab rows follow in wave B).

≤819px (tab-bar tier):

Bottom tab bar (Personal, Recents, Favourites, Spaces, More) — the sidebar has always been display:none below 820px with no replacement, leaving those views unreachable. Tabs proxy the existing nav-* buttons; active state syncs from setView via window.__syncTab; hidden navs (e.g. Spaces without permission) hide their tab; the Transfers unseen-dot surfaces on More.
More sheet: Shares, Transfers, Federated, Deleted files under their existing visibility rules + Administration (gated on feat.admin).
Shell: #app bottom padding + 100dvh, safe-area insets; tab bar hidden in adminmode (wave D revisits).

≤480px (phone tier):

Every .menu/.fbpop popover becomes a bottom sheet: one shared CSS mechanism (grabber, 46px rows, 76dvh cap, safe-area padding) + scrim via body:has(...) at z-80 under sheets at z-90 — document-level click-away close keeps working unchanged.
Top-bar search collapses to a magnifier that expands to a full-width row (16px input so iOS doesn't zoom) with Cancel.

Desktop invariant (≥820px): all new CSS is fenced behind max-width media blocks except one base #searchtoggle, #searchcancel, #tabbar{display:none} rule; injected elements are inert there. A build gate in the one-shot scanned all six <style> blocks and asserted no phone selector leaks outside the media fences; both inline script blocks pass node --check.

i18n: navMore, phCancel ×4 (en/de-CH/fr/it), reusing existing nav*/adminSettings keys for everything else.

Waves B–D (list & actions, layers, admin drill-in + editor bar) follow as separate releases.

Wave A of the #389 mobile pass, per the approved mockup and the decisions recorded on the issue (bottom tab bar; functional admin; star+kebab rows follow in wave B). **≤819px (tab-bar tier):** - Bottom tab bar (Personal, Recents, Favourites, Spaces, More) — the sidebar has always been `display:none` below 820px with no replacement, leaving those views unreachable. Tabs proxy the existing `nav-*` buttons; active state syncs from `setView` via `window.__syncTab`; hidden navs (e.g. Spaces without permission) hide their tab; the Transfers unseen-dot surfaces on More. - More sheet: Shares, Transfers, Federated, Deleted files under their existing visibility rules + Administration (gated on `feat.admin`). - Shell: `#app` bottom padding + `100dvh`, safe-area insets; tab bar hidden in adminmode (wave D revisits). **≤480px (phone tier):** - Every `.menu`/`.fbpop` popover becomes a bottom sheet: one shared CSS mechanism (grabber, 46px rows, 76dvh cap, safe-area padding) + scrim via `body:has(...)` at z-80 under sheets at z-90 — document-level click-away close keeps working unchanged. - Top-bar search collapses to a magnifier that expands to a full-width row (16px input so iOS doesn't zoom) with Cancel. **Desktop invariant (≥820px):** all new CSS is fenced behind max-width media blocks except one base `#searchtoggle, #searchcancel, #tabbar{display:none}` rule; injected elements are inert there. A build gate in the one-shot scanned all six `<style>` blocks and asserted no phone selector leaks outside the media fences; both inline script blocks pass `node --check`. i18n: `navMore`, `phCancel` ×4 (en/de-CH/fr/it), reusing existing `nav*`/`adminSettings` keys for everything else. Waves B–D (list & actions, layers, admin drill-in + editor bar) follow as separate releases.

Cordy added 8 commits

2026-09-13 18:20:10 +00:00

scout: wave-A anchors (menu base css, avatar admin entry, setView tail, applySel) 6825cc7977

one-shot: #389 wave A — phone shell (tab bar, More sheet, sheets, search, dvh) 5abfb0eef6

one-shot: tabbar desktop base rule + corrected post-condition counts 5240d94d15

scout2: brace context of the .fbsort CSS anchor 2f6e35e737

scout2: anchor lives in second style block - trace there 3aaee655c8

scout3: locate .fbsort anchor in raw file structure 79b14ed121

one-shot: fence gate scans all style blocks (anchor lives in rd-style) + scout cleanup 1e9676eb13

feat(#389 ): mobile wave A - phone navigation shell

ci / test-and-build (pull_request) Successful in 54s

Details

68c67e437b

Below 820px the sidebar has always been display:none with no
replacement, leaving Recents/Favourites/Spaces/Shares/Trash/Transfers
/Admin unreachable. This wave injects a bottom tab bar (Personal,
Recents, Favourites, Spaces, More) synced with setView's active-nav
logic, plus a More sheet proxying the hidden sidebar buttons under
their existing visibility rules with counts/dots. At <=480px one
shared mechanism turns every .menu/.fbpop popover into a bottom sheet
(scrim via body:has, grabber, 46px rows, safe-area padding), the
top-bar search collapses to a magnifier that expands to a full-width
16px-input row with Cancel, and the shell moves to dvh + safe-area
units. All of it is fenced behind max-width media queries and
phone-only JS injection; a build gate asserts no phone selector
leaks outside the media blocks, so >=820px desktop is untouched.

Cordy scheduled this pull request to auto merge when all checks succeed

2026-09-13 18:20:25 +00:00