✨ Add ViewTransitions component to layout for improve navigation

src/components/viewTransitions.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+  import { onNavigate } from "$app/navigation";
+  onNavigate((navigation) => {
+    if (!document.startViewTransition) return;
+    return new Promise((resolve) => {
+      document.startViewTransition(async () => {
+        resolve();
+        await navigation.complete;
+      });
+    });
+  });
+</script>

src/routes/+layout.svelte

@@ -10,12 +10,14 @@
   // Providers:
   import { ModeWatcher } from "mode-watcher";
   import Sidebar from "@/components/layout/sidebar.svelte";
+  import ViewTransitions from "@/components/viewTransitions.svelte";
 
   // SSR Data:
   let { data, children }: LayoutProps = $props();
 </script>
 
 <ModeWatcher />
+<ViewTransitions />
 <Header githubStars={data?.stars} />
 <Sidebar>
   {@render children?.()}