Open hasdfa opened 1 month ago
The ?inline
in import will definitely not work with the way we are exporting the public api/files.
Also, Pigment CSS doesn't deal with shadow dom right now. All the css is extracted similar to how you'd write css modules. So all the generated classe names are random (but deterministic). Ideally, this shouldn't affect the page styles, unless you are also writing global css.
Summary
When you're using shadow root, styles are injected in the
head
of the document - so it's not possible to use pigment CSS with shadow dom.Examples
Vite.js (import of .css file)
https://codesandbox.io/p/devbox/pigment-css-shadow-dom-lf6tck?file=/src/index.tsx:20,1
Vite.js (inline import)
https://codesandbox.io/p/devbox/pigment-css-shadow-dom-lf6tck?file=/src/index-inline.tsx:11,1
Motivation
Search keywords: shadow dom