Темный режим не применяется в Tailwind CSS - проблема конфигурации? ⇐ CSS

[Anonymous]

Я следил за документацией для настройки ручного режима Dark Redoc Here
Dark Mode Docs < /p>

Код: Выделить всё

@import 'tailwindcss';

@custom-variant dark (&:where(.dark, .dark *));
< /code>
Но все же я все еще вижу белый фон, даже когда я объявляю на теге HTML как Dark Class < /p>
import './global.css'
import type { Metadata } from 'next'
import { GeistSans } from 'geist/font/sans'
import { GeistMono } from 'geist/font/mono'
import { Navbar } from './components/nav'
import { Analytics } from '@vercel/analytics/react'
import { SpeedInsights } from '@vercel/speed-insights/next'
import Footer from './components/footer'
import { baseUrl } from './sitemap'

export const metadata: Metadata = {
metadataBase: new URL(baseUrl),
title: {
default: 'Next.js Portfolio Starter',
template: '%s | Next.js Portfolio Starter',
},
description: 'This is my portfolio.',
openGraph: {
title: 'My Portfolio',
description: 'This is my portfolio.',
url: baseUrl,
siteName: 'My Portfolio',
locale: 'en_US',
type: 'website',
},
robots: {
index: true,
follow: true,
googleBot: {
index: true,
follow: true,
'max-video-preview': -1,
'max-image-preview': 'large',
'max-snippet': -1,
},
},
}

const cx = (...classes) => classes.filter(Boolean).join(' ')

export default function RootLayout({
children,
}: {
children: React.ReactNode
}) {
return (




{children}






)
}
< /code>
Мои зависимости следующие < /p>
{
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start"
},
"dependencies": {
"@tailwindcss/postcss": "4.0.0-alpha.13",
"@types/node": "20.11.17",
"@types/react": "18.2.55",
"@types/react-dom": "18.2.19",
"@vercel/analytics": "^1.1.3",
"@vercel/speed-insights": "^1.0.9",
"geist": "1.2.2",
"next": "canary",
"next-mdx-remote": "^4.4.1",
"postcss": "^8.4.35",
"react": "18.2.0",
"react-dom": "18.2.0",
"sugar-high": "^0.6.0",
"tailwindcss": "4.0.0-alpha.13",
"typescript": "5.3.3"
}
}

White bg
Я попробовал tailwind.config.js и я попробовал метод, упомянутый выше, но ни один из>

Подробнее здесь: https://stackoverflow.com/questions/797 ... tion-issue