Theme is broken

[daninus14]

As it stands the theme is chosen based on the system choice, and not on the tailwind choice. Even if the tailwind config is not setting the dark mode, the component will be displayed in dark mode.

There should be a prop to choose the theme, and then another way to base it on the tailwind config and not on the user's system alone...

[daninus14]

After restarting the server, the light theme loaded, but it still should be easier to change the theme by a prop.

Thanks!

[murilosr]

Yes, I had the same problem. I didn't set a color theme, but it was using my system's one (dark), but the rest of the page was on the default (white mode), so it was weird.

This was how I fixed it:

// tailwind.config.js
{
    ...
    darkMode: 'class', // Insert this
    ...
}

Useful readings:

• Toggling dark mode manually
• Supporting system preference and manual selection

[daninus14]

@murilosr thank you so much for the workaround and for the tailwind doc links!

[HurSungYun]

Same here. Fixed it using the workaround @murilosr suggested. Thank you.