Any plans to integrate CSS Cascade layers?

CSS recently introduced the ability to define your own cascade layers, and it seems like it is gaining browser support. Hopefully will be available in all major browsers soon.

References:
https://developer.mozilla.org/en-US/docs/Web/CSS/@layer
https://css-tricks.com/css-cascade-layers/
https://www.youtube.com/watch?v=NDNRGW-_1EE

Was curious to know whether this is being discussed to include in Discourse’s codebase?

I think it could be a great addition and could help with specificity difficulties and can also help us avoid using the !important flag.

Perhaps a set of layers could be defined in the main codebase. Perhaps something like:

@layer base, layout, theme, utilities;

and theme developers can leverage the “theme” layer to easily add customizations without having to be so specific with selectors or use !important flags.

6 Likes

This does seem like it would be useful, but we really have to wait for more established browser support (especially because I don’t think this has a reasonable fallback?). Most browsers have only added this in the past month… so I can’t imagine implementing it for at least another year.

11 Likes