open-source-labs / Svelvet

🎛 A Svelte library for building dynamic, infinitely customizable node-based user interfaces and flowcharts
https://svelvet.io
2.5k stars 161 forks source link

Styles are not applied inside a custom element #481

Open trusz opened 8 months ago

trusz commented 8 months ago

Hi there!

So far I like the library! I have came across, a hopfuly small, styling issue.

In case the svelvet component is inside a custom element, in a shadow DOM the :root styles are not applied and the css variables cannot be used.

Here is a reproduction on stackblitz: https://stackblitz.com/edit/svelvet-v7-b7kwdt?file=src%2Fcomponents%2Fsvelvet-comp.svelte

I've played around a bit and I think the problem can be solved if you add :host to rules where you have :root.

So something like:

:root, :host{
...
}