🐛 Adjust for repo path

Author: CollierCZ

packages/docs/src/app.d.ts

@@ -0,0 +1,13 @@
+// See https://svelte.dev/docs/kit/types#app.d.ts
+// for information about these interfaces
+declare global {
+  namespace App {
+    // interface Error {}
+    // interface Locals {}
+    // interface PageData {}
+    // interface PageState {}
+    // interface Platform {}
+  }
+}
+
+export {};

packages/docs/src/lib/components/NavLink.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   import { MediaQuery } from "svelte/reactivity";
 
+  import { resolve } from "$app/paths";
   import { navStyles } from "$lib/utils/classConst";
   import { getNavigationItems } from "$lib/utils/getNavigationItems";
   import { removeNumbersFromNavLinks } from "$lib/utils/handleNavNumbers";
@@ -29,8 +30,9 @@
                 <li>
                   <a
                     onclick={closeNav}
-                    href={`/docs/${removeNumbersFromNavLinks(childPath)}`}
-                    >{childData.title}</a
+                    href={resolve(
+                      `/docs/${removeNumbersFromNavLinks(childPath)}`
+                    )}>{childData.title}</a
                   >
                 </li>
               {/each}
@@ -40,7 +42,7 @@
           <li>
             <a
               onclick={closeNav}
-              href={`/docs/${removeNumbersFromNavLinks(itemPath)}`}
+              href={resolve(`/docs/${removeNumbersFromNavLinks(itemPath)}`)}
               >{itemData.title}</a
             >
           </li>

packages/docs/src/lib/components/SiteNav.svelte

@@ -3,6 +3,8 @@
 
   import SiteNav from "./SiteNav.svelte";
 
+  import { resolve } from "$app/paths";
+
   const medium = new MediaQuery("min-width: 768px");
 
   let isOpen = $state(false);
@@ -11,7 +13,7 @@
 <nav
   class="px-6 lg:px-0 py-4 flex justify-between max-w-4xl mx-auto items-center border-b-2"
 >
-  <a class={!medium.current && "hidden"} href="/">Home </a>
+  <a class={!medium.current && "hidden"} href={resolve("/")}>Home </a>
   <button
     class={medium.current && "hidden"}
     onclick={() => {
@@ -26,7 +28,7 @@
     </svg>
   </button>
   <section class="*:pl-2">
-    <a href="/docs/get-started">Docs</a>
+    <a href={resolve("/docs/get-started")}>Docs</a>
     <a href="https://github.com/CollierCZ/markdoc-svelte">GitHub</a>
   </section>
 </nav>

packages/docs/src/lib/components/TopNav.svelte

@@ -1,15 +1,16 @@
 <script lang="ts">
-  import type { PageData } from './$types'
-  
-  let { data }: { data: PageData } = $props()
+  import type { PageData } from "./$types";
+
+  import { resolve } from "$app/paths";
+
+  let { data }: { data: PageData } = $props();
   const title = $derived(data.page.frontmatter?.title);
 </script>
 
 <svelte:head>
   <title>{title}</title>
 </svelte:head>
 
-
 <div class="grid h-screen place-items-center pb-32">
   <div class="grid place-items-center px-4 md:px-0">
     <h1 class="font-extrabold text-4xl">{title}</h1>
@@ -18,7 +19,7 @@
     </div>
     <a
       class="rounded-lg bg-green-100 p-4 text-green-900"
-      href="/docs/get-started">Get started</a
+      href={resolve("/docs/get-started")}>Get started</a
     >
   </div>
 </div>

packages/docs/src/routes/+page.svelte

@@ -18,6 +18,9 @@ const config = {
     adapter: adapter({
       fallback: "404.html",
     }),
+    paths: {
+      base: "/markdoc-svelte",
+    },
   },
 };