mirror of
https://github.com/webstudio-is/webstudio.git
synced 2026-11-10 06:24:35 +09:00
f76dadcef9fa4328dd31d32971aaa313ab949885
Closes #6312 ## Summary - Restore the Commands & search header to the command panel surface so its embedded input no longer appears darker or exposes rounded bottom-corner cutouts. - Restore unchecked checkboxes to the borderless resting treatment used by inputs and textareas. - Restore unchecked switches to the neutral control surface used before the redesign. - Restore the header split button's open background on the dropdown segment. - Keep checkbox hover and keyboard-focus boundaries visible. ## Technical choices - Override the generic `InputField` background only in the command component; ordinary inputs continue using the secondary control surface. - Use a transparent resting checkbox border to preserve dimensions, then apply the existing default border on hover and focus border on keyboard focus. - Share the existing neutral button surface recipe with the unchecked Switch track, preserving the historical relationship without adding a new semantic theme variable. - Match the split-menu trigger's semantic `aria-expanded` state because the nested tooltip owns and overwrites `data-state`. - Remove the obsolete forced 3:1 resting-boundary recipe. ## Todo - [x] Audit text inputs, textareas, search, selects, comboboxes, checkbox, radio, switch, toggle, and nested control surfaces. - [x] Restore the command header's panel-background override. - [x] Remove the checkbox's high-contrast resting border. - [x] Restore the unchecked Switch's neutral track surface. - [x] Preserve checkbox hover and focus feedback. - [x] Restore the split-button dropdown segment's open background. - [x] Add light- and dark-mode regression coverage and confirm the tests fail before each fix and pass after it. - [x] Visually verify affected controls and the open split button in Storybook in light and dark modes. - [x] Review documentation impact; no user-facing documentation update is required for restoring the previous visual treatment. - [x] Review fixture impact; no fixture inputs or generated outputs are affected. ## Verification - `pnpm --filter @webstudio-is/design-system test` — 19 files and 228 tests passed. - `pnpm --filter @webstudio-is/design-system typecheck` - Targeted Oxlint, formatting, and `git diff --check` - Storybook audit and visual review in light and dark modes
Learning Resources
Social Media
License
- Webstudio core (all functionality in this repository) is free/open-source under AGPL-3.0-or-later.
- sdk-components-animation package (optional) is proprietary. You must accept the Webstudio, Inc. EULA located in sdk-components-animation/LICENSE before using it.
Languages
TypeScript
98.9%
PLpgSQL
0.5%
CSS
0.3%
Shell
0.2%
JavaScript
0.1%