nextjs-starter-medusa: Dark mode incompatibility

I’ve got the same problem even with 2.4.1. And I also don’t think it’s any dark: leftovers, as there are no dark: classes in the code.

However, there is a layout.css file being generated, that sets the color variables based on the css prefers-color-scheme: dark setting.

It’s because the ui-preset tailwind plugin is looking at the config to see, if the darkMode: 'class' property is set in the tailwind.config.js. If not (as it is by default), it overrides the color variables based on the system color scheme.

So you can fix it by explicitly saying the dark-mode isn’t set based on the system:

module.exports = {
  darkMode: 'class',
  presets: [require("@medusajs/ui-preset")],
  …
}

I could also create a PR to make this the default behaviour for freshly created nextjs-starters, if that’s wanted

It’s not a priority as of now, but we might add it later. Feel free to add it as an idea to GH discussions!