up

frontend/src/views/NotFound.vue

@@ -0,0 +1,34 @@
+<template>
+  <div class="min-h-screen bg-gray-50 flex items-center justify-center px-4">
+    <div class="text-center max-w-md">
+      <div class="mb-8">
+        <div class="w-32 h-32 mx-auto bg-primary-100 rounded-full flex items-center justify-center">
+          <svg class="w-16 h-16 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.172 16.172a4 4 0 015.656 0M9 10h.01M15 10h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+          </svg>
+        </div>
+      </div>
+      <h1 class="text-6xl font-bold text-gray-900 mb-4">404</h1>
+      <p class="text-xl text-gray-600 mb-8">Oops! Page not found</p>
+      <p class="text-gray-500 mb-8">The page you are looking for might have been removed, had its name changed, or is temporarily unavailable.</p>
+      <div class="flex flex-col sm:flex-row gap-4 justify-center">
+        <router-link
+          to="/dashboard"
+          class="px-6 py-3 bg-primary-600 text-white rounded-lg hover:bg-primary-700 transition-colors"
+        >
+          Go to Dashboard
+        </router-link>
+        <router-link
+          to="/login"
+          class="px-6 py-3 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition-colors"
+        >
+          Sign In
+        </router-link>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+// No additional logic needed
+</script>