Add 404 page

public/_redirects

@@ -1,4 +1,5 @@
 https://moritz-ruth.de/* https://moritzruth.de/:splat 301!
 /terms /terms-and-conditions
 /agb /terms-and-conditions
+/kontakt /contact
 /* /index.html 200

src/components/NavigationMenu.vue

@@ -15,7 +15,7 @@
     :class="[scrolled && 'shadow-lg', active ? 'opacity-100' : '-sm:opacity-0 -sm:pointer-events-none']"
   >
     <div class="flex items-center justify-between h-full max-w-1200px mx-auto flex-grow -sm:flex-col px-6 sm:px-10">
-      <div class="fixed transition-all duration-500" :style="{ left: blobState.x + 'px', top: blobState.y + 'px', opacity: blobState.show ? 1 : 0 }">
+      <div class="pointer-events-none fixed transition-all duration-500" :style="{ left: blobState.x + 'px', top: blobState.y + 'px', opacity: blobState.show ? 1 : 0 }">
         <BlurredBlobCanvas
           :colors="['#eb34cf', '#818cff']"
           :opacity-variation="0"

src/pages/[...all].vue

@@ -0,0 +1,41 @@
+<template>
+  <div class="prose pt-20 flex items-center justify-center flex-col h-50vh">
+    <h1 class="text-center">
+      {{ t("heading") }}
+    </h1>
+    <p class="mt-10">
+      <router-link to="/" class="text-blue-700">
+        {{ t("back") }}
+      </router-link>
+    </p>
+  </div>
+</template>
+
+<i18n lang="yaml">
+  en:
+    heading: This page does not exist.
+    back: Back to home
+    cat: Show me a picture of a cat
+
+  de:
+    heading: Diese Seite existiert nicht.
+    cat: Zeig mir ein Bild einer Katze
+    back: Zurück zur Startseite
+</i18n>
+
+<script>
+  import { useI18n } from "vue-i18n"
+  import ExternalLink from "../components/ExternalLink.vue"
+
+  export default {
+    name: "NotFoundPage",
+    components: { ExternalLink },
+    setup() {
+      const { t } = useI18n()
+
+      return {
+        t
+      }
+    }
+  }
+</script>