Tailwind css dark mode classes not picked up when passed as props.

[federicomarcantognini]

It looks as Tailwind CSS dark mode styles cannot do anything when passed as props. For instance:

<MultiSelect 
        id="..."
        closeDropdownOnSelect = 'true'
        outerDivClass = "!dark:bg-gray-800 !bg-gray-100"
>
...
</MultiSelect>

the dark: does not affect the component CSS style. Also, each Tailwind CSS style passed as props needs to be !important otherwise no effect.

Am I missing something?

[janosh]

See sveltejs/svelte#6859 and various previous issues in this repo (e.g. #257) on why a fix is not straightforward.

[enzon19]

You are using it wrong... It's dark:!bg-gray-800 !bg-gray-100. This works fine for me

See more:
https://tailwindcss.com/docs/configuration#important-modifier