feat(docs): layout styles

docs/src/.vuepress/assets/index.css

@@ -1,10 +1,16 @@
 :root {
   --primary: #BB86FC;
   --secondary: #03dac5;
+  --content-width: 100%;
+}
+
+.dark {
+  --c-text-lighter: white !important;
+  --c-text: white !important;
 }
 
 html, body {
-  @apply scrollbar scrollbar-thin scrollbar-thumb-rounded scrollbar-thumb-green-500 scrollbar-track-gray-300;
+  @apply scrollbar scrollbar-thin scrollbar-thumb-rounded scrollbar-thumb-green-500 scrollbar-track-black;
 }
 
 .home {
@@ -12,7 +18,16 @@ html, body {
   @apply !px-0;
 }
 
-.container {
+.page, .page-meta, .footer, .sidebar {
+  @apply dark:(!bg-black text-white);
+}
+
+.theme-default-content {
+  @apply overflow-scroll md:overflow-hidden;
+}
+
+.navbar {
+  @apply dark:bg-gray-900;
 }
 
 h1 {

docs/src/.vuepress/theme/layouts/default.vue

@@ -16,10 +16,9 @@ import ParentLayout from '@vuepress/theme-default/lib/client/layouts/Layout.vue'
 </template>
 <style>
 .page-footer {
-  padding: 2.5rem;
+  @apply dark:(text-white bg-black) pt-[2rem];
   border-top: 1px solid var(--c-border);
   text-align: center;
-  color: var(--c-text-lighter);
   transition: border-color var(--t-color);
 }
 </style>

docs/src/.vuepress/windi.config.ts

@@ -7,7 +7,7 @@ export default defineConfig({
   extract: {
     include: [
       resolve(__dirname, '../../components/**/*.{ts,md,vue}'),
-      resolve(__dirname, '../src/**/*.{ts,md,vue}')
+      resolve(__dirname, '../**/*.{ts,md,vue}')
     ],
   },