chore: add uno css to docs

docs/src/theme/index.ts

@@ -1,6 +1,7 @@
 import { h } from 'vue';
 import type { Theme as ThemeType } from 'vitepress';
 import DefaultTheme from 'vitepress/theme';
+import 'virtual:uno.css';
 import './style.css';
 
 const theme: ThemeType = {

docs/src/theme/style.css

@@ -35,6 +35,8 @@
 	--vp-c-default-3: #211f35;
 
 	--vp-c-brand-1: #ffda93;
+	--vp-c-brand-2: #9e7047;
+	--vp-c-brand-3: #835b39;
 }
 
 :root {
@@ -230,3 +232,37 @@ h3 .badge {
 .dark .badge-get {
 	--badge-color: 66 189 134;
 }
+
+.form-input {
+	@apply py-1.5 rounded-md b-solid b-[--vp-c-default-3] shadow-sm focus:border-[--vp-c-brand-2] focus:ring-1 focus:ring-[--vp-c-brand-2] bg-[--vp-c-bg];
+
+	&:disabled {
+		background-color: var(--vp-c-bg-soft);
+	}
+}
+
+.form-checkbox,
+.form-radio {
+	background-color: var(--vp-c-bg);
+	border-color: var(--vp-c-bg);
+	color: var(--vp-c-brand-2);
+
+	&:disabled, &:disabled:hover {
+		background-color: var(--vp-c-bg-soft);
+	}
+
+	&:checked {
+		@apply bg-[--vp-c-brand-2];
+		&:hover {
+			@apply bg-[--vp-c-brand-3];
+		}
+	}
+	&:focus {
+		@apply ring-offset-0 ring-[--vp-c-brand-2];
+	}
+
+}
+
+.form-checkbox {
+	@apply rounded;
+}

docs/vitepress.config.ts

@@ -1,4 +1,5 @@
 import { defineConfig, type DefaultTheme } from 'vitepress';
+import UnoCSS from 'unocss/vite';
 import Inspect from 'vite-plugin-inspect';
 import { docExporter, moduleDocTransform, UModulePathRegex } from './src/plugins';
 //import { modules } from '@scripts/modules';
@@ -34,6 +35,7 @@ export default defineConfig({
 	vite: {
 		publicDir: 'docs/public',
 		plugins: [
+			UnoCSS(),
 			Inspect(),
 			exporterPlugin,
 			transformPlugin,

package.json

@@ -33,6 +33,8 @@
 		"tsutils": "^3.21.0",
 		"typescript": "^5.5.4",
 		"typescript-eslint": "^8.2.0",
+		"unocss": "^0.61.9",
+		"@julr/unocss-preset-forms": "^0.1.0",
 		"vite": "^5.4.1",
 		"vite-plugin-inspect": "^0.8.5",
 		"vitepress": "1.3.3",