feat(theme): add @theme block inside dark media query for Tailwind v4 compile-time dark tokens

2026-05-25 13:22:30 -04:00
parent cc41f4ad32
commit 3842a20b35
1 changed files with 24 additions and 0 deletions
--- a/web/src/app.css
+++ b/web/src/app.css
@@ -320,6 +320,30 @@
    --color-focus-ring: #818cf8;
  }

+  @theme {
+    --color-bg: #111827;
+    --color-bg-secondary: #1f2937;
+    --color-bg-tertiary: #374151;
+
+    --color-text-primary: #f9fafb;
+    --color-text-secondary: #d1d5db;
+    --color-text-tertiary: #9ca3af;
+
+    --color-border: #374151;
+    --color-border-dark: #4b5563;
+
+    --color-success-bg: #0c4a6e;
+    --color-warning-bg: #78350f;
+    --color-error-bg: #7f1d1d;
+    --color-info-bg: #1e1b4b;
+
+    --color-glass: rgba(17, 24, 39, 0.8);
+    --color-glass-dark: rgba(17, 24, 39, 0.9);
+    --gradient-card-start: #1f2937;
+    --gradient-card-end: #0b1120;
+    --color-dot-grid: #374151;
+    --color-focus-ring: #818cf8;
+  }
 }

 :root.light {