From 4d63af9e6315ebbbe201b9923dbfa4ee32b9f525 Mon Sep 17 00:00:00 2001
From: Teemu Koivisto <tkoivisto456@gmail.com>
Date: Sat, 12 Jul 2025 15:29:21 +0300
Subject: [PATCH] use $app/paths base for site links

---
 packages/site/src/routes/+layout.svelte | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/packages/site/src/routes/+layout.svelte b/packages/site/src/routes/+layout.svelte
index 18df138..18c9fdf 100644
--- a/packages/site/src/routes/+layout.svelte
+++ b/packages/site/src/routes/+layout.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+  import { base } from '$app/paths'
   import type { Base16Theme } from 'svelte-tree-view'
 
   import DataSelector from '$components/DataSelector.svelte'
@@ -55,27 +56,31 @@
     <PropsForm />
     <DataSelector />
     <div class="my-4">
-      <a class="btn" data-test-id="btn-1" href="/" data-sveltekit-keepfocus data-sveltekit-noscroll
-        >(1) Basic</a
+      <a
+        class="btn"
+        data-test-id="btn-1"
+        href="{base}/"
+        data-sveltekit-keepfocus
+        data-sveltekit-noscroll>(1) Basic</a
       >
       <a
         class="btn ml-2"
         data-test-id="btn-2"
-        href="/diff"
+        href="{base}/diff"
         data-sveltekit-keepfocus
         data-sveltekit-noscroll>(2) Diff</a
       >
       <a
         class="btn ml-2"
         data-test-id="btn-3"
-        href="/circular"
+        href="{base}/circular"
         data-sveltekit-keepfocus
         data-sveltekit-noscroll>(3) Circular</a
       >
       <a
         class="btn ml-2"
         data-test-id="btn-3"
-        href="/tailwind"
+        href="{base}/tailwind"
         data-sveltekit-keepfocus
         data-sveltekit-noscroll>(4) Tailwind</a
       >