fix(modules): add gray scheme color to module

META DATA: @toantranmei

playground/app.config.ts

@@ -1,6 +1,6 @@
 export default defineAppConfig({
   meiUI: {
-    primary: "green",
+    primary: "purple",
     gray: "cool",
   },
 });

src/runtime/mei-ui.css

@@ -1 +1,9 @@
+.dark {
+  color-scheme: dark;
+}
 
+a:focus-visible {
+  @apply outline-primary;
+}
+
+::selection { @apply bg-primary/40; }

src/runtime/plugins/colors.ts

@@ -8,7 +8,7 @@ import { name } from "../../../package.json";
 export default defineNuxtPlugin(() => {
   const appConfig = useAppConfig();
   const nuxtApp = useNuxtApp();
-  const colors = tailwindConfig.theme.colors
+  const colors = tailwindConfig.theme.colors;
   const root = computed(() => {
     const primary: Record<string, string> | undefined =
       colors[appConfig.meiUI.primary];
@@ -34,9 +34,17 @@ export default defineNuxtPlugin(() => {
         .join("\n")}
       --color-primary-DEFAULT: var(--color-primary-500);
 
+      ${Object.entries(gray || colors.cool)
+        .map(
+          ([key, value]) => `--color-gray-${key}: ${hexToRgb(value as string)};`
+        )
+        .join("\n")}
+      }
+
       .dark {
         --color-primary-DEFAULT: var(--color-primary-400);
-    }`;
+      }
+    `;
   });
 
   // Head