init

.vitepress/theme/index.ts

@@ -0,0 +1,36 @@
+import { h } from "vue";
+import type { Theme } from "vitepress";
+import DefaultTheme from "vitepress/theme";
+import { useData, useRoute } from "vitepress";
+import codeblocksFold from "vitepress-plugin-codeblocks-fold";
+import "vitepress-plugin-codeblocks-fold/style/index.css";
+import "./style.css";
+import "virtual:uno.css";
+
+export default {
+  extends: DefaultTheme,
+
+  Layout: () => {
+    return h(DefaultTheme.Layout, null, {
+      // Here you can define custom layout slots or modify the layout.
+    });
+  },
+
+  enhanceApp({ app, router, siteData }) {
+    // This is where you can add additional app enhancements or global components
+    // For example, registering global components or plugins
+    // DefaultTheme.enhanceApp(ctx) can be called here if needed
+    // Using the plugin within enhanceApp() is possible if needed, but `setup()` is a cleaner way to do it.
+  },
+
+  setup() {
+    // Get frontmatter and route from VitePress composition API
+    const { frontmatter } = useData();
+    const route = useRoute();
+
+    // Set up the codeblocks fold plugin with route and frontmatter data
+    // The second argument enables collapsing by default (true/false)
+    // The third argument sets the max height of the code block before it collapses (in pixels)
+    codeblocksFold({ route, frontmatter }, true, 400);
+  },
+} satisfies Theme;