For example, in the following code (live demo - works in Chrome with flag)
:root {
--foo: orange;
--bg: {
background: var(--foo);
}
}
body {
--foo: green;
@apply --bg;
}<body> should be green, not orange. That will allow parameterization of @apply mixins, which is what authors really want (and already do with preprocessors, bloating the CSS size as it spits out different code for each call). If it's just about copying a bunch of declarations, they can always preprocess that. It's also surprising, given that in every other case variables resolve based on current element.
For example, in the following code (live demo - works in Chrome with flag)
<body>should be green, not orange. That will allow parameterization of@applymixins, which is what authors really want (and already do with preprocessors, bloating the CSS size as it spits out different code for each call). If it's just about copying a bunch of declarations, they can always preprocess that. It's also surprising, given that in every other case variables resolve based on current element.