feat(theme): migrate to Tailwind CSS variables and refactor theme system

Author: YESWmeshade

docs/tailwind.config.js

@@ -1,16 +1,16 @@
 module.exports = {
   content: [
-    './docs/**/*.{md,mdx,js,ts,jsx,tsx}',
-    './theme/**/*.{js,ts,jsx,tsx}',
+    "./docs/**/*.{md,mdx,js,ts,jsx,tsx}",
+    "./theme/**/*.{js,ts,jsx,tsx}",
   ],
-  darkMode: ['selector'],
+  darkMode: ["selector"],
   theme: {
     extend: {
       colors: {
-        background: 'hsl(var(--background))',
-        foreground: 'hsl(var(--foreground))',
-        primary: 'hsl(var(--primary))',
-      }
-    }
-  }
-}
+        background: "hsl(var(--background))",
+        foreground: "hsl(var(--foreground))",
+        primary: "hsl(var(--primary))",
+      },
+    },
+  },
+};

docs/theme/styles/index.css

@@ -5,7 +5,7 @@
   --color-background: hsl(0 0% 100%);
   --color-foreground: hsl(222.2 84% 4.9%);
   --color-primary: hsl(221.2 83.2% 53.3%);
-  
+
   --color-background: var(--background);
   --color-foreground: var(--foreground);
   --color-primary: var(--primary);

docs/theme/styles/index.tsx

@@ -1,7 +1,7 @@
 import { useLang } from "rspress/runtime";
 import {
   HomeLayout as BasicHomeLayout,
-  Layout as BasicLayout
+  Layout as BasicLayout,
 } from "rspress/theme";
 import "./styles/index.css";
 
@@ -21,7 +21,7 @@ const Layout = () => {
             : "🚧 MateChat React 文档仍在开发中"}
         </div>
       }
-    // components={{ ... }}
+      // components={{ ... }}
     />
   );
 };