feat: tailwindcss dark mode color

src/style.css

@@ -1,3 +1,21 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
+
+@layer base {
+  :root {
+    --text-main: #333;
+    --text-secondary: #4b525d;
+    --bg-card: #fff;
+    --bg-active: #fbfbfc;
+    --bg-hover: #eee;
+  }
+
+  html.dark {
+    --text-main: #f7f7f7;
+    --text-secondary: #6f6e84;
+    --bg-card: #28334e;
+    --bg-active: #242b40;
+    --bg-hover: #303044;
+  }
+}

tailwind.config.js

@@ -5,12 +5,15 @@ module.exports = {
   theme: {
     extend: {
       colors: {
-        main: '#5973fe',
         yes: '#3fb68b',
         no: '#ff5353',
         info: '#00b2ff',
-        textMain: '#333',
         primary: '#666cff',
+        main: 'var(--text-main)',
+        secondary: 'var(--text-secondary)',
+        card: 'var(--bg-card)',
+        hover: 'var(--bg-hover)',
+        active: 'var(--bg-active)',
       },
     },
   },