Первые минут 20 все было отлично, dark mode работал, потом решил поменять цвета и все перестало работать.
Dark mode не работает именно в body теге, все остальные dark:классы которые проходят через react render работают.
Tailwind CSS устанавливал как
PostCSS.
Сборка Vite
Выбирал >>React >>JavaScript
[tailwind.config.js]
/** @type {import('tailwindcss').Config} */
module.exports = {
darkMode: ['selector', '[data-mode="dark"]'],
content: ["./src/**/*.{html,js,jsx}"],
theme: {
extend: {},
},
plugins: [],
}
[index.css]
@tailwind base;
@tailwind components;
@tailwind utilities;
[index.html]
<!doctype html>
<html lang="en" data-mode="dark">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + React</title>
<link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'>
</head>
<body class="
text-gray-800
bg-gray-100
dark:text-gray-100
dark:bg-gray-900">
<div id="root"></div>
<script type="module" src="/src/main.jsx"></script>
</body>
</html>
