4 ms·
This is it. This is all I’ve wanted in CSS for the last decade. In fact, I just wanted basic mixins without function-like behavior, but this gets me there. The
by namuol 2y ago
This is it. This is all I’ve wanted in CSS for the last decade. In fact, I just wanted basic mixins without function-like behavior, but this gets me there.
The comments here indicate that the article doesn’t do much to explain what this does or why you’d want it, but basically this gives you a way to reuse blocks of styles without needing to resort to e.g. utility classes or other hacks that get around specificity issues. The syntax doesn’t help explain that.
Shame about the syntax, but I’m used to it at this point.
- klabb3 2y agoCan you expand with some examples of pressing use cases? To me, great complexity should bring even greater utility. I have no use for this, and I’m not sure who it’s for. Can we get rid of tailwind? Polyfills? Any UI libs?
- namuol 2y agoIt’s hard to explain because most web development solves these problems with CSS in JS with JS runtimes. One use case I have is what I call “responsive variants”; basically a way to apply a variant’s styles on a component instance (speaking abstractly here; could be react, vue, whatever) within any arbitrary styling context without duplicating CSS or resorting to something that applies CSS with a JS runtime. I work on a web development platform for a living and this is the sort of thing that would be good for us; if you don’t want your website to wait for JS to render content correctly and you want to keep your CSS bundle small, there aren’t many good options.
- vbezhenar 2y agoHow do you replace mixins with those functions?
- genuine_smiles 2y agoCan these be used as mixins? I looks like there’s only a single return value. Edit: Looks like mixins are planned: https://github.com/w3c/csswg-drafts/issues/9350#issuecomment-1939628591 https://github.com/w3c/csswg-drafts/issues/9350#issuecomment...
- namuol 2y agoYes good point, this is unfortunately just the first part of the proposal being implemented. Mixins are the next part.