Add 404

components/AppPartial.vue

@@ -0,0 +1,14 @@
+<template>
+  <ContentQuery :path="partial" find="one" v-slot="{ data }">
+    <ContentRenderer :value="data" />
+  </ContentQuery>
+</template>
+
+<script setup>
+defineProps({
+  partial: {
+    type: String,
+    required: true,
+  },
+});
+</script>

content/_404.md

@@ -0,0 +1,10 @@
+# Oops! You've wandered into the void. 🌌
+
+It seems the page you're looking for has vanished into thin air.
+
+But don't worry, my swarm of interdimensional nanobots is on the
+case!
+
+Meanwhile, why not explore the [homepage](/home){class="link"}?
+
+[🚀]{class="text-3xl"}

pages/[...slug].vue

@@ -14,7 +14,11 @@
       class="flex flex-col justify-center max-w-2xl mx-auto bg-standard"
     >
       <div class="flex flex-col justify-center">
-        <ContentDoc />
+        <ContentDoc>
+          <template #not-found>
+            <AppPartial path="/_404" />
+          </template>
+        </ContentDoc>
       </div>
     </main>
   </div>