mirror of
https://github.com/webstudio-is/webstudio.git
synced 2026-11-03 02:27:57 +09:00
Oleg Isonen
3f18f44456
## Change Settings collapsibles now use `fullWidth` so right-side Builder Style and Settings panel content owns its inline padding. Existing visual insets are preserved, and Action explicitly owns its zero inset so its header and action rows can span the section width. - Forward `fullWidth` through `CollapsibleSectionWithAddButton`. - Remove the `fullWidth` prop and padding wrapper from `StyleSection`; all ten StyleSection callers own their content insets locally, including Size's zero inset and full-width separator. - Move Properties & attributes, diagnostics, individual Style panel section insets into their own content. - Keep normal property controls inset and let Action control its own header, rows, error, and redirect spacing. - Retain the earlier Form Action add-trigger and resource-row changes. Action content starts below its full section header with a small gap. ## Implementation - [x] Prevent overlap between the Action section header and its items: start content below the full header with the existing 2px gap, preserving row size and inset. - [x] Review padding-only wrappers from the right-side Settings and Style panel refactors. Apply padding directly to an existing Flex container where possible and remove redundant Box wrappers. - [x] Replace the Action dropdown hardcoded 180px minimum width with the closest existing spacing token, `theme.spacing[26]` (176px; 4px narrower). - [x] Review documentation impact for the dropdown token change: reviewed the Form action documentation; no update required. - [x] Remove the `fullWidth` prop from `StyleSection`. Each individual Style panel section content container explicitly owns its inline padding: ordinary sections retain 12px and Size retains zero inset, with existing gaps preserved. - [x] Give CollapsibleSection content zero inline padding using the existing `fullWidth` API for right-side Builder Style and Settings panel sections. Each section explicitly owns its inline padding, preserving current visual insets and allowing sections such as Action to control alignment. ## Verification - Action spacing: 13 focused Chromium browser tests, focused oxlint, formatting, and `git diff --check` passed. Geometry asserts a 36px header, 2px gap before the first item, button clearance, and unchanged 24px row height. - Restored Page Settings to its original padding ownership; all 7 focused Page Settings Chromium tests, focused oxlint, and `git diff --check` passed. - Padding-wrapper follow-up: removed redundant Box wrappers around the Navigation mode Flex and baseline Action header fixture; audited right-side Settings and Style panel padding owners. 10 focused Action Chromium tests, focused oxlint, and `git diff --check` passed. - Dropdown token follow-up: 13 focused Action Chromium tests, focused oxlint, and `git diff --check` passed. The browser assertion verifies the 176px computed minimum width. - 428 Style panel Chromium browser tests passed after moving padding into individual sections. - 43 focused Chromium browser tests passed: Action, PropsSection, page settings, search, diagnostics, and request inspector. - Builder TypeScript check, focused oxlint, and `git diff --check` passed. - Assert the Properties collapsible has zero inline padding while its child owns its 12px inset; existing Action geometry checks pass.