Extended properties

[EdgarsLv]

in v3 i had extended theme
extend: {
flex: {
full: '1 1 100%',
10: '1 1 10%',
15: '1 1 15%',
20: '1 1 20%',
25: '1 1 25%',
...
},
after migration to v4 these are added in @theme as variables
--flex-10: 1 1 10%;
--flex-15: 1 1 15%;
--flex-20: 1 1 20%;
--flex-25: 1 1 25%;
--flex-full: 1 1 100%;

but they doesn't work, on element class="flex-full does nothing.
in migration guide there is nothing about extended variables.

i guess solution is to manually do flex-(--flex-full)?

[wongjn]

You could also extend the flex utility to use your theme variables:

@utility flex-* {
  flex: --value(--flex-*);
}