Wdym by ignore?

The current problem is that the parsed CSS looks like this:

.page-module__E0kJGG__description:where(.page-module__E0kJGG__dark, .page-module__E0kJGG__dark *) {
  color: var(--color-red-500);
}

But it should look like this:

.page-module__E0kJGG__description:where(.dark, .dark *) {
  color: var(--color-red-500);
}

This is important so that Tailwind V4 works completely with the ModuleCSS. And for this I would have to ignore the .dark properties somehow so that they are not parsed

Related to https://github.com/tailwindlabs/tailwindcss/issues/15814

Push

Oh this issue.

I don't think it's possible in normal modules. I just added the selectors in the global css file, otherwise, checkout scss.

sass, whatever

I got it to work with the following code:

:global(.dark) .cool_text {
    @apply text-red-500;
}

The global tag means that the .dark is not parsed. It is a bit annoying this way, but I accept it

I found out last night, but forgot to tell you here. Thanks for your help

something to consider about turbopack
https://nextjs.org/docs/app/api-reference/turbopack#unsupported-features