Vitepress conversion of docs. (#23795)

builddefs/docsgen/.vitepress/theme/QMKLayout.vue

@@ -0,0 +1,18 @@
+<script setup>
+import DefaultTheme from 'vitepress/theme'
+import { useRouter } from 'vitepress'
+import { onBeforeMount } from 'vue';
+
+const router = useRouter()
+onBeforeMount(async () => {
+    if (window.location.href.includes('/#/')) {
+        const newUrl = window.location.href.replace(/\/#\//, '/').replace(/\?id=/, '#');
+        window.history.replaceState({}, '', newUrl);
+        await router.go(newUrl);
+    }
+});
+</script>
+
+<template>
+    <DefaultTheme.Layout/>
+</template>

builddefs/docsgen/.vitepress/theme/custom.css

@@ -0,0 +1,19 @@
+/* Override <kbd> as vitepress doesn't put them with borders */
+kbd {
+    border: 1px solid var(--vp-c-text-1);
+    border-radius: 0.6em;
+    margin: 0.2em;
+    padding: 0.2em;
+}
+
+:root {
+    --vp-nav-logo-height: 100%;
+}
+
+.logo {
+    padding-bottom: 0.2em;
+}
+
+.VPNavBarTitle.has-sidebar .title {
+    border-bottom: 0;
+}

builddefs/docsgen/.vitepress/theme/index.ts

@@ -0,0 +1,13 @@
+import type { Theme } from 'vitepress'
+import DefaultTheme from 'vitepress/theme'
+import { enhanceAppWithTabs } from 'vitepress-plugin-tabs/client'
+import QMKLayout from './QMKLayout.vue'
+import './custom.css'
+
+export default {
+  extends: DefaultTheme,
+  Layout: QMKLayout,
+  enhanceApp({ app }) {
+    enhanceAppWithTabs(app)
+  }
+} satisfies Theme