webviews: fix the react-apps-check base red from Settings > Menus (#25592) and dialog grow-in (#27638)

Merged
TE
6d ago
+26-21

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 checkIntroduced byFix
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"#25592the dragged row's z-index: 2 is var(--layer-raised)
popup-one-hairline.test.ts (.menu-row[data-dragging], edges 0)#25592a 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)#25592the 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)#25592the 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-check shards are the evidence.

Agent session: agent session

šŸ¤– Generated with Claude Code