Similar UI controls have very inconsistent behavior around defaults #47976
Labels
[Feature] Inspector Controls
The interface showing block settings and the controls available for each block
Needs Design Feedback
Needs general design feedback.
[Type] Bug
An existing feature does not function as intended
When modifying block settings, there are several distinct ways that controls with similar appearances behave:
1. A group with an explicit "default" or "none" value, which is usually preselected:
An example of this is the block width alignment control is very clear, as it includes an option labeled "none":
2. A group with no option preselected:
Examples include the text align control and vertical alignment control on the columns block, which come with no default value and let you unset their value by clicking on them, allowing you to return to whatever the default is provided by the editor, theme or block style:
CleanShot.2023-02-10.at.11.16.32.mp4
CleanShot.2023-02-10.at.11.18.02.mp4
3. A group with one option preselected without the ability to unset it:
The vertical/horizontal alignment controls on the row block, stack block and buttons block start with one option selected by default, and that cannot be unset:
CleanShot.2023-02-10.at.11.15.56.mp4
CleanShot.2023-02-10.at.11.19.58.mp4
This variant is particularly problematic because it means these blocks sometimes output the corresponding classes/CSS for the default setting, but only if another option has been selected and then changed back to the default. This is inefficient, and also limits the ability for themes to write CSS that contextually modifies defaults while respecting user choices (ex.
.is-style-whatever .wp-block-group.is-layout-flex.is-vertical:not([class*="-content-justification"]) {}
)1Having these similar controls all behave inconsistently is very confusing in use, and there are other issues that point out similar issues with other controls:
is-style-default
in block styles, including Block style: ensure default for theme is properly reflected in the UI #45430It would be ideal if there was a consistent way to "unset" every control, like Webflow's "reset" function.
Footnotes
The current state of the row/stack blocks requires such nightmarish CSS selectors. 😒 (#44880) ↩
The text was updated successfully, but these errors were encountered: