add search

Author: DerGoogler

docs/.vitepress/config/shared.ts

@@ -1,13 +1,16 @@
-import { defineConfig, SiteConfig } from "vitepress";
+// Plugins
 import ViteYaml from "@modyfi/vite-plugin-yaml";
+import { pagefindPlugin } from "vitepress-plugin-pagefind";
+// Imports
+import { defineConfig, SiteConfig } from "vitepress";
 import { writeFile } from "fs/promises";
 import { resolve } from "path";
 import { repositoriesJSONstringify } from "../../data/repositories";
 import { blacklistJSONstringify } from "../../data/blacklist";
 
 export const shared = defineConfig({
   vite: {
-    plugins: [ViteYaml()],
+    plugins: [ViteYaml(), pagefindPlugin()],
   },
   markdown: {
     lineNumbers: true,
@@ -30,6 +33,11 @@ export const shared = defineConfig({
       },
     ],
   ],
+  themeConfig: {
+    search: {
+      provider: "local",
+    },
+  },
   transformPageData(pageData, ctx) {
     if (pageData.params?.title) {
       pageData.title = pageData.params.title;

docs/components/repository/RepoHeader.vue

@@ -2,10 +2,6 @@
 import VPButton from "../vite/VPButton.vue";
 
 defineProps(["repo"]);
-
-const openUrl = (url) => {
-  window.open(url);
-};
 </script>
 
 <template>

docs/en/repository/[name]/[id].md

@@ -17,7 +17,7 @@ const module = ref(params.value.module)
 const showModal = ref(false)
 
 const versions = computed(() => {
-  return module.value.versions.toReversed();
+  return [...module.value.versions].reverse();
 }); 
 
 const latestVersion = computed(() => {
@@ -60,7 +60,6 @@ const latestVersion = computed(() => {
 </div>
 
 
-
 <div v-if="module.track.antifeatures && module.track.antifeatures.length">
     <h2>Anti-Features</h2>
     <p>The following Anti-Features have been found.</p>
@@ -88,21 +87,6 @@ const latestVersion = computed(() => {
     </article>
 </div>
 
-<Teleport to="body">
-  <Transition name="modal">
-    <div v-show="showModal" class="modal-mask">
-      <div class="modal-container">
-        <p>Hello from the modal!</p>
-        <div class="model-footer">
-          <button class="modal-button" @click="showModal = false">
-            Close
-          </button>
-        </div>
-      </div>
-    </div>
-  </Transition>
-</Teleport>
-
 <style module>
 .moduleCover {
     width: 100%;
@@ -204,59 +188,4 @@ const latestVersion = computed(() => {
     margin: 4px;
     transform: translateY(-2px);
 }
-</style>
-
-<style scoped>
-.modal-mask {
-  position: fixed;
-  z-index: 200;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  background-color: rgba(0, 0, 0, 0.5);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  transition: opacity 0.3s ease;
-}
-
-.modal-container {
-  width: 300px;
-  margin: auto;
-  padding: 20px 30px;
-  background-color: var(--vp-c-bg);
-  border-radius: 2px;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.33);
-  transition: all 0.3s ease;
-}
-
-.model-footer {
-  margin-top: 8px;
-  text-align: right;
-}
-
-.modal-button {
-  padding: 4px 8px;
-  border-radius: 4px;
-  border-color: var(--vp-button-alt-border);
-  color: var(--vp-button-alt-text);
-  background-color: var(--vp-button-alt-bg);
-}
-
-.modal-button:hover {
-  border-color: var(--vp-button-alt-hover-border);
-  color: var(--vp-button-alt-hover-text);
-  background-color: var(--vp-button-alt-hover-bg);
-}
-
-.modal-enter-from,
-.modal-leave-to {
-  opacity: 0;
-}
-
-.modal-enter-from .modal-container,
-.modal-leave-to .modal-container {
-  transform: scale(1.1);
-}
-</style>
+</style>