rob-balfre / svelte-select

Svelte Select. A select component for Svelte
https://svelte-select-examples.vercel.app
Other
1.27k stars 180 forks source link

[V5] css properties override do not seem to work on list or items #440

Closed vboulaye closed 2 years ago

vboulaye commented 2 years ago

Hi,

I am trying to migrate from V4 to V5. I use css properties to apply a custom theme to the Select Item. I updated the names of the properties but it does not work as before.

I tested it in the REPL and it does not seem to work there either. For example if I add to the following properties to the .themed class in the REPL :

        --item-is-active-bg: #000000;
        --item-hover-bg: #666666;
        --item-hover-color: #fefefe;

I expect the colors of the item in the list to change but they stay blue. It seems that only the properties on the first "level" of the svelte-sleect component can be changed. Is there another way to change the properties used inside List or Item ?

rob-balfre commented 2 years ago

Got 2 options here... Use :root or appendListTarget... See REPL https://svelte.dev/repl/e0cd96c0711a46f4a390aaf486d7283c?version=3.49.0

vboulaye commented 2 years ago

Thanks, it works fine! (I used the :root selector)