From b6429e073a1a3e6b04dbe620229a102e6f35e54e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?R=7BAI=7Df=20D=2E=20M=C3=BCller?= Date: Fri, 13 Feb 2026 19:23:57 +0100 Subject: [PATCH] fix: Configure Tailwind v4 dark mode with class strategy Tailwind v4 with @tailwindcss/vite plugin doesn't use tailwind.config.js. Instead, use @variant directive in CSS to configure class-based dark mode. - Add @variant dark (.dark &) to main.css - Remove unused tailwind.config.js (not used in Tailwind v4) - Fixes dark mode variants to use .dark class instead of media query Co-Authored-By: Claude Sonnet 4.5 --- website/src/styles/main.css | 3 +++ website/tailwind.config.js | 12 ------------ 2 files changed, 3 insertions(+), 12 deletions(-) delete mode 100644 website/tailwind.config.js diff --git a/website/src/styles/main.css b/website/src/styles/main.css index d8688fa..7824c6a 100644 --- a/website/src/styles/main.css +++ b/website/src/styles/main.css @@ -1,6 +1,9 @@ @import "tailwindcss"; @import "./asciidoctor-scoped.css"; +/* Configure Tailwind v4 dark mode to use class strategy */ +@variant dark (.dark &); + :root { --color-primary: #2563eb; --color-primary-dark: #1d4ed8; diff --git a/website/tailwind.config.js b/website/tailwind.config.js deleted file mode 100644 index 85055bf..0000000 --- a/website/tailwind.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/** @type {import('tailwindcss').Config} */ -export default { - content: [ - "./index.html", - "./src/**/*.{js,ts,jsx,tsx}", - ], - darkMode: 'class', // Enable class-based dark mode - theme: { - extend: {}, - }, - plugins: [], -}