Glass layer + indexing ring (stacked on BM3)

kayg commented

2026-10-31 16:57:14 +00:00

Owner

Stacked on BM3 — must land after #772

Resumes the cut-off port from review/preview-2026-10-29 @ b1d82c10. Scope: item 1 (shared see-through glass layer) and item 4 (indexing ring in ListFilter / ListSearch). Out of scope: ⌘K preview pane, When bar-morph.

What

Float.svelte + lib/portal.ts (portal, follow): the bar and every sheet that grows out of it are drawn in <body>, so no pane's backdrop-filter can make them a backdrop root. Desktop: an invisible .bar-anchor stays in the pane (its CSS, its spring); the bar follows it (ResizeObserver + a rAF burst after a transition/animation). Phone: the bar is fixed to the screen already, so it just moves. Home Screen: stays inline.
Found while resuming: in <body> the bar no longer inherits its screen's inert/visibility:hidden (a note under its list, Notes under Settings). New idle prop on Bar (from BottomBar's active) → inert + visibility:hidden after 380 ms; back at once. Without it two bars were live and the Notes tab sat over the phone's search dock.
Ring (StillIndexing, Spinner, indexing.svelte.ts): loads only while the index is building; takes the magnifier's room (words never move).
Specs: glass-portal, glass-ring, glass-frames (rAF deltas, x1 and x6).

Decisions

Idle bar on a phone hides instead of sliding with its screen (it no longer lives in the screen). Entry: it shows at once while the note slides in. Small; flag if you want a matching slide.
Spec fixes (not code): desktop shows tabs until the text is touched; the follow probe reads in frame order (probe runs before the follow, so it sees the bar one frame behind; picture is in sync); the ring's accent is read where the ring is (.on-glass redefines --accent).

Budgets (`bundle-size.mjs`, KiB brotli)

first paint js 239.95 / 240 (base 239.4, +0.55) · first css 20.5 / 22.1 · all js 313.5 / 315. No overage.

Gates (cua@calternal-dev-02-std, Chromium + WebKit, 1440 + 390)

bunx playwright test e2e/glass-portal.spec.ts e2e/glass-ring.spec.ts e2e/glass-roots.spec.ts e2e/glass.spec.ts e2e/sheet-geometry.spec.ts e2e/bar-focus.spec.ts e2e/bar-stays.spec.ts e2e/toast-bar.spec.ts e2e/phone-bars.spec.ts --project=chromium-1440 --project=chromium-390 --project=webkit-1440 --project=webkit-390 --workers=1
→ 703 passed, 2 failed (the follow probe, fixed since), then glass-portal alone on all four: 28 passed, 4 skipped (phone-only/desktop-only). dev-01 chromium (glass-portal/ring/roots/frames): 61 passed, only the frame specs failed.
Pictures (1440/390, light/dark, Chromium + WebKit; bar, sheets, menu, palette, ring): ~/glass-evidence on dev-02.

Open risk: frame deltas NOT proven at 60 fps

Headless Chromium on these Linux VMs has no GPU: even a plain CSS-rotating ring draws at ~20 fps (50 ms deltas) on dev-02 and worse on loaded dev-01, so glass-frames x1 fails there (over-25 ms counts: bar 18–23, menu 16–19, ring 46–54 of ~25–55 frames). Same spec on the BM3 base, same host: bar 14, menu 12 — same ceiling, mine slightly higher (noise-level, not proven equal). The 60 fps claim needs a GPU host (Mac VM macos-01 via Cua space); not done. The x6 projects only record. Do not read the x1 failures as a regression nor as a pass.

🤖 Generated with Claude Code

## Stacked on BM3 — must land after #772 Resumes the cut-off port from `review/preview-2026-10-29` @ b1d82c10. Scope: item 1 (shared see-through glass layer) and item 4 (indexing ring in ListFilter / ListSearch). Out of scope: ⌘K preview pane, When bar-morph. ### What - `Float.svelte` + `lib/portal.ts` (`portal`, `follow`): the bar and every sheet that grows out of it are drawn in `<body>`, so no pane's backdrop-filter can make them a backdrop root. Desktop: an invisible `.bar-anchor` stays in the pane (its CSS, its spring); the bar follows it (ResizeObserver + a rAF burst after a transition/animation). Phone: the bar is fixed to the screen already, so it just moves. Home Screen: stays inline. - **Found while resuming:** in `<body>` the bar no longer inherits its screen's `inert`/`visibility:hidden` (a note under its list, Notes under Settings). New `idle` prop on `Bar` (from `BottomBar`'s `active`) → `inert` + `visibility:hidden` after 380 ms; back at once. Without it two bars were live and the Notes tab sat over the phone's search dock. - Ring (`StillIndexing`, `Spinner`, `indexing.svelte.ts`): loads only while the index is building; takes the magnifier's room (words never move). - Specs: `glass-portal`, `glass-ring`, `glass-frames` (rAF deltas, x1 and x6). ### Decisions - Idle bar on a phone hides instead of sliding with its screen (it no longer lives in the screen). Entry: it shows at once while the note slides in. Small; flag if you want a matching slide. - Spec fixes (not code): desktop shows tabs until the text is touched; the follow probe reads in frame order (probe runs before the follow, so it sees the bar one frame behind; picture is in sync); the ring's accent is read where the ring is (`.on-glass` redefines `--accent`). ### Budgets (`bundle-size.mjs`, KiB brotli) first paint js **239.95 / 240** (base 239.4, +0.55) · first css 20.5 / 22.1 · all js 313.5 / 315. No overage. ### Gates (cua@calternal-dev-02-std, Chromium + WebKit, 1440 + 390) `bunx playwright test e2e/glass-portal.spec.ts e2e/glass-ring.spec.ts e2e/glass-roots.spec.ts e2e/glass.spec.ts e2e/sheet-geometry.spec.ts e2e/bar-focus.spec.ts e2e/bar-stays.spec.ts e2e/toast-bar.spec.ts e2e/phone-bars.spec.ts --project=chromium-1440 --project=chromium-390 --project=webkit-1440 --project=webkit-390 --workers=1` → 703 passed, 2 failed (the follow probe, fixed since), then `glass-portal` alone on all four: **28 passed, 4 skipped (phone-only/desktop-only)**. dev-01 chromium (glass-portal/ring/roots/frames): 61 passed, only the frame specs failed. Pictures (1440/390, light/dark, Chromium + WebKit; bar, sheets, menu, palette, ring): `~/glass-evidence` on dev-02. ### Open risk: frame deltas NOT proven at 60 fps Headless Chromium on these Linux VMs has no GPU: even a plain CSS-rotating ring draws at ~20 fps (50 ms deltas) on dev-02 and worse on loaded dev-01, so `glass-frames` x1 fails there (over-25 ms counts: bar 18–23, menu 16–19, ring 46–54 of ~25–55 frames). Same spec on the BM3 base, same host: bar 14, menu 12 — same ceiling, mine slightly higher (noise-level, not proven equal). The 60 fps claim needs a GPU host (Mac VM macos-01 via Cua space); not done. The x6 projects only record. Do not read the x1 failures as a regression nor as a pass. 🤖 Generated with [Claude Code](https://claude.com/claude-code)

kayg added 9 commits

2026-10-31 16:57:14 +00:00

WIP: shared glass layer (Float, portal follow, Bar) and indexing ring d2726e4549

Indexing watch asks through the api directly 275f0c89e7

Ring loads only while indexing 4231bb6a20

follow: read the anchor's box only a18bfa5a01

Specs: glass portal, indexing ring, frame deltas db82c92b0e

Idle bars: hidden and inert when their screen is under another; spec fixes 2eb57caf44

glass-portal spec: desktop shows the tabs until the text is touched ba11673de6

glass-portal spec: read the bar the way the frame order shows it d8808528ac

glass-portal spec: pick the live anchor

CI / server (pull_request) Has been cancelled