-
Notifications
You must be signed in to change notification settings - Fork 4.6k
Description
Related to #39371
What problem does this address?
Developers have a lot of flexibility when creating a spacing scale for a theme. This is great.
For instance, TT4 uses a 10-60 scale, and TT3 uses a 30-80 scale.
However, when a spacing preset is in a pattern markup (maybe copied from a public library or another theme) but is not defined in the theme.json of the active theme, the result is zero spacing.
The following is an example of the preset --wp--preset--spacing--20 being used in a pattern while it is not defined:
The editor only creates CSS variables for the presets defined in theme.json, resulting in zero spacing.
What is your proposed solution?
We could avoid this issue by defaulting to the variable --wp--style--block-gap when a spacing preset is not defined.
Here is a possible implementation for the default 20-80 spacing scale:
:body {
--wp--preset--spacing--20: var(--wp--style--block-gap);
--wp--preset--spacing--30: var(--wp--style--block-gap);
--wp--preset--spacing--40: var(--wp--style--block-gap);
--wp--preset--spacing--50: var(--wp--style--block-gap);
--wp--preset--spacing--60: var(--wp--style--block-gap);
--wp--preset--spacing--70: var(--wp--style--block-gap);
--wp--preset--spacing--80: var(--wp--style--block-gap);
}For reference: What is blockGap and how can I use it?
cc: @richtabor @annezazu
