Allow using CSS level 4 viewport-relative units#54415
Conversation
|
Size Change: +1.09 kB (0%) Total Size: 1.65 MB
ℹ️ View Unchanged
|
38e563f to
c37bdad
Compare
c37bdad to
71c990e
Compare
febc88b to
fe741ae
Compare
|
Hey folks, when making changes to |
|
My apologies @ciampo, I missed that. Do you want me to do a quick follow-up PR? |
|
That would be great, thank you! Feel free to ping me for the review :) |
|
Thanks! Added a PR in #55201 👍 |
|
Seemingly related to this PR above, Chiming in that this opt-in of new units works correct for padding, block gap, min height, BUT is not showing up in the dropdown for Dimensions > Height > Fixed (a field that only appears for certain nested group/stack/row blocks for example) Started an issue here to discuss and shared a screenshot etc: #67750 |
What?
Adds support for viewport-relative, CSS level-4 units.
These units are not exposed anywhere by default, but if a user enables them via
theme.json, they should be available.All these units have good browser support (see https://caniuse.com/viewport-unit-variants) and will allow designers to build more versatile interfaces.
Fixes #52441
Why?
Because we should not explicitly forbid the use of CSS units - which is what happens if they are not defined in our lists of available CSS units.
How?
Testing Instructions
theme.jsonfile. Insettings.spacing.unitswe have an array of units that the theme supports. In that array, add some of the units defined in this PR (like for examplesvmin,svmax)Testing Instructions for Keyboard
Nothing specific for keyboard users. This change allows selecting more units, and does not change the existing selectors so nothing changes in the UI/UX.
Screenshots or screencast