glass: toast and machine popover let terminal text behind them stay legible (adopt #391's glass bed) #422

Open
opened 2026-11-07 10:53:13 +00:00 by kayg · 1 comment
Owner

Found by J344 while reviewing #391 (comment 84294): on origin/dev, the shared floating-card glass lets text behind it stay legible. This violates TASTE "Glass shows colour, never legible text".

  • Toast: legible text behind it on desktop (correlation 0.7–0.9 against the unblurred text).
  • Machine popover: leaks at its edges (ring correlation 0.94–1.0).
  • Tooltip and add-host card: not tested meaningfully (empty backdrop).

Cause (J300, #391): a card's own backdrop blur fades at its box edges, so small cards show the unblurred page there, and a bigger blur makes it worse. #391 adds a shared "glass bed" in packages/ui (attachGlassBed(card)). Once #391 merges, adopt it for every floating card, with the #391 pixel spec run over a dense terminal for each.

Found by J344 while reviewing #391 (comment 84294): on origin/dev, the shared floating-card glass lets text behind it stay legible. This violates TASTE "Glass shows colour, never legible text". - **Toast:** legible text behind it on desktop (correlation 0.7–0.9 against the unblurred text). - **Machine popover:** leaks at its edges (ring correlation 0.94–1.0). - **Tooltip and add-host card:** not tested meaningfully (empty backdrop). Cause (J300, #391): a card's own backdrop blur fades at its box edges, so small cards show the unblurred page there, and a bigger blur makes it worse. #391 adds a shared "glass bed" in packages/ui (`attachGlassBed(card)`). Once #391 merges, adopt it for every floating card, with the #391 pixel spec run over a dense terminal for each.
Author
Owner

From J355's review of #391 (comment 85348, head eee0ed2a9), the two P2s that were not blocking the merge of #391 and belong to this follow-up; the toast and machine popover are the main job here, adopting the same glass bed (packages/ui/src/glass-bed.ts).

1. Sidebar-started removal card on a phone still leaks a sliver at its rim. J355's ring metric (3 to 8 px just inside the edge, high-pass correlation with the page behind) gives sidebar phone Frosted 0.71 ink, 0.41 paper with the bed (0.91 and 0.76 without), against 0.00 on sidebar desktop and 0.01 to 0.14 on every palette-started case. Visually (rim-zoom-sidebar-phone-ink.png in #391): one or two glyph fragments ("8", "-") on the card's left border and the page's own text straddling the bottom border; nothing reads as a word. Energy behind that ring is only 3.5 to 4.4 (the sidebar's blank rows), so part of the correlation may be the card's own border on a near-empty ring. My spec reports 0.25 for this case (whole 14 px rim); its limit is 0.3, so it passes. Suggested: measure a thinner outer ring (3 to 8 px) as well, raise the sidebar text floor, and check whether the anchored phone card needs a bed reach above 3 sigma. Not tested.

2. That same case does not catch a missing bed. Sidebar-started phone Tinted measures 0.143 ink and 0.047 paper without the bed, under the 0.15 limit, because the card sits mostly over the sidebar's own blank rows. The 24 palette-started cases do catch it (small-phone Tinted 0.42 without the bed), and the colour check makes an opaque card fail, so the centred card is protected; the anchored phone card is the least protected path. Suggested: put dense text behind the anchored card on phones (a sidebar that overlays a terminal, or a window behind it) so the energy floor is meaningful.

Spec to change: apps/tracer/test/host-removal-confirm.spec.ts (sidebar loop, MIN_TEXT_BEHIND_SIDEBAR, LEGIBLE_RIM_CORRELATION) and apps/tracer/test/glyph-legibility.ts (the ring in measure).

From J355's review of #391 (comment 85348, head `eee0ed2a9`), the two P2s that were not blocking the merge of #391 and belong to this follow-up; the toast and machine popover are the main job here, adopting the same glass bed (`packages/ui/src/glass-bed.ts`). **1. Sidebar-started removal card on a phone still leaks a sliver at its rim.** J355's ring metric (3 to 8 px just inside the edge, high-pass correlation with the page behind) gives sidebar phone Frosted **0.71 ink, 0.41 paper** with the bed (0.91 and 0.76 without), against 0.00 on sidebar desktop and 0.01 to 0.14 on every palette-started case. Visually (`rim-zoom-sidebar-phone-ink.png` in #391): one or two glyph fragments ("8", "-") on the card's left border and the page's own text straddling the bottom border; nothing reads as a word. Energy behind that ring is only 3.5 to 4.4 (the sidebar's blank rows), so part of the correlation may be the card's own border on a near-empty ring. My spec reports 0.25 for this case (whole 14 px rim); its limit is 0.3, so it passes. Suggested: measure a thinner outer ring (3 to 8 px) as well, raise the sidebar text floor, and check whether the anchored phone card needs a bed reach above 3 sigma. Not tested. **2. That same case does not catch a missing bed.** Sidebar-started phone Tinted measures 0.143 ink and 0.047 paper without the bed, under the 0.15 limit, because the card sits mostly over the sidebar's own blank rows. The 24 palette-started cases do catch it (small-phone Tinted 0.42 without the bed), and the colour check makes an opaque card fail, so the centred card is protected; the anchored phone card is the least protected path. Suggested: put dense text behind the anchored card on phones (a sidebar that overlays a terminal, or a window behind it) so the energy floor is meaningful. Spec to change: `apps/tracer/test/host-removal-confirm.spec.ts` (sidebar loop, `MIN_TEXT_BEHIND_SIDEBAR`, `LEGIBLE_RIM_CORRELATION`) and `apps/tracer/test/glyph-legibility.ts` (the ring in `measure`).
Sign in to join this conversation.
No labels
launch-qa
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
kayg/infraternal#422
No description provided.