Open ronalson opened 6 years ago
đ¤ I suppose this should ideally work but I don't think it was considered and I don't see any tests/docs around this scenario so I'll leave it as a enhancement for now.
This can be simplified to,
Input
.btn {
--btn-bg-color: #000;
background-color: var(--btn-bg-color);
}
.btn.foo {
--btn-bg-color: #f00;
}
Output
.btn {
background-color: #000;
}
Expected
.btn {
background-color: #000;
}
.btn.foo {
background-color: #f00;
}
đ sorry for the extra verbose example.
But can you elaborate what does the enhancement
status mean? I'm not sure if I should wait for it or not.
Is there anything I can do to help with this feature? Or (better) can you point me to and workaround?
@ronalson enhancement
just means that it would ideally work but wasn't considered in the current implementation. It's some extra functionality vs something broken. I don't have plans to fix the current implementation but feel free to submit a PR with tests.
Here is a workaround đ¤ˇââď¸ ,
.btn,
.btn.foo {
--btn-bg-color: #000;
background-color: var(--btn-bg-color);
}
.btn.foo {
--btn-bg-color: #f00;
}
I am working on a major refactor here, https://github.com/MadLittleMods/postcss-css-variables/tree/major-refactor but no ETA on having that finished.
Thanks @MadLittleMods.
I'll playing with the workaround to see how far I can get. Already found some issues with undefined variables, but I have some ideas on how to get pass it.
BTW, thanks for making the plugin. I'll keep an eye on this major refactor.
I'm really sorry that issue was closed, because I have the same issue.
I'm trying to use the
postcss-css-variables
to build a CSS file for legacy browsers such as IE usingpreserved = false
.However I'm getting a inconsistent output while using multi-classes selector
.class1.class2 {}
. More specifically, the custom property value set inside this type of selector is ignored by the plugin.Am I targeting something completed off?
Input
Expected Output
Actual Output