webviews: fix the react-apps-check base red from Settings > Menus (#25592) and dialog grow-in (#27638)
Merged
TE
6d ago+26+26+01234567890123456789-21-21-01234567890123456789
Summary
Fixes the react-apps-check (1) and (3) base red on feat-cmux-next (cmux-next web; latest base run 41152853071 at 9c9b6d11). It came back after #28601 landed, from two newer merges. Both are teammates' PRs; this changes only their CSS.
| Failing check | Introduced by | Fix |
|---|---|---|
check:design-tokens gate (12 new literals in pages/settings/styles.css) | #25592 (451c25bd, Settings > Menus) | spacing onto the scale (--ds-space-1/2/4; the 1px row gaps become 0). The 16px icon, 12px twisty and 6px edited dot are not control heights, so they go in design-tokens-baseline.jsonl |
check:layers gate, check-layers.test.ts "this checkout passes with its baseline" | #25592 | the dragged row's z-index: 2 is var(--layer-raised) |
popup-one-hairline.test.ts (.menu-row[data-dragging], edges 0) | #25592 | a lifted row is not a popup, so it casts var(--elevation-2), the drop --ui-popup-drop resolves to, instead of the popup token |
gallery-control-surfaces.test.ts (pages.settings-menus: hover li.menu-row: button.icon-button lights its ancestor) | #25592 | the row's hover wash skips while one of its own icon buttons is hovered (:not(:has(.icon-button:hover))). The button lights alone, and the row's actions still show |
web lint (fast) (ContextMenusCard.tsx 380 jsx-a11y/no-autofocus, 420 prefer-tag-over-role) | #25592 | the rename field's suppression was a biome-ignore, which oxlint doesn't read. Both lines now carry oxlint-disable-next-line with a reason, as AgentHarnesses.tsx and DevicesCard.tsx do |
new-tab-no-entry-menus.test.ts (dialog [opacity, scale] on a New Tab) | #27638 (0b0968d6, smoother dialogs) | the dialog's grow-in and the backdrop's fade take a new --ui-dialog-open (the standard step), which newtab/noEntry.css sets to 0s like --ui-popup-open. Exits keep --ui-popup-close |
UI effect: Settings > Menus spacing moves by 1 to 2px to land on the scale. Hovering a row's button no longer washes the whole row. On a New Tab only, a dialog appears without the grow-in. Everywhere else dialogs keep #27638's motion.
Changelog
none
Observed / Not run
bun scripts/check-design-tokens.ts: at the base, the 12 violations above; at this head, "Design token ratchet passed".python3 scripts/cmux-next/check-layers.py: at the base, "1 raw z-index, baseline 0 (lines 1951)"; at this head, ok.- The base failures for every test above were read from run 41152853071 (job 124393609990) and run 41152271249.
- Not run locally: the browser suites (gallery-control-surfaces, new-tab-no-entry-menus) and popup-one-hairline. This PR's
react-apps-checkshards are the evidence.
Agent session: agent session
š¤ Generated with Claude Code