4 ms·

With /deep/ deprecated and css @apply nowhere in sight I'm not sure I like styling stuff inside shadow boxes...

• spankalee 8y ago
  CSS Shadow Parts, aka ::part and ::theme is the answer there: https://meowni.ca/posts/part-theme-explainer/ https://meowni.ca/posts/part-theme-explainer/
  • xab9 8y ago
    Thanks, didn't know about part and theme - and again, I'm not sure if I like it. For example angular puts [innerHTML] into a shadow container - let's assume we are talking about arbitrary localized text from a cms, heavily sanitized, with basic html elements allowed only. With both deep and apply going the way of the dodo, I'm not sure when will we have part and theme support, but heck, this again, just like css variables, need an effort on the 3rd party's side (to add part descriptors and chain prefixers - gosh, those prefixers sure smell bemish), which may or may not happen. All I need is a fail safe way of modifying style inside shadow containers without the 3rd party adding support for it (right now we are modifying an angular material based site, because, you know, before the release the most important thing is that how these elements animate or how their drop shadow look), fail safe meaning that it should not be possible to accidentally overwrite stuff inside shadows (like generic link styling). But probably it's a conflict of interest... everyone wants perfectly contained elements (because css is scary) but wants to retain maximum customizability without modifying the upstream package, plus we don't want shadow contained css to be duplicated. Not sure if there's a good solution for that.