From 80401b64054603ba3d114e4737a3f241c0b7ffa4 Mon Sep 17 00:00:00 2001
From: Corentin Thomasset <corentin.thomasset74@gmail.com>
Date: Thu, 13 Apr 2023 00:03:08 +0200
Subject: [PATCH] refactor(404): simplified 404 page

---
 src/pages/404.page.vue | 25 +++++++++++--------------
 1 file changed, 11 insertions(+), 14 deletions(-)

diff --git a/src/pages/404.page.vue b/src/pages/404.page.vue
index b8cba46c..4ec1cb46 100644
--- a/src/pages/404.page.vue
+++ b/src/pages/404.page.vue
@@ -1,23 +1,20 @@
 <script setup lang="ts">
+import { Coffee } from '@vicons/tabler';
 import { useHead } from '@vueuse/head';
 
 useHead({ title: 'Page not found - IT Tools' });
 </script>
 
 <template>
-  <div class="e404-wrapper">
-    <n-result status="404" title="404 Not Found" description="Sorry, this page does not seem to exist">
-      <template #footer>
-        <router-link to="/" #="{ navigate, href }" custom>
-          <n-button tag="a" :href="href" secondary type="success" @click="navigate"> Back home </n-button>
-        </router-link>
-      </template>
-    </n-result>
+  <div mt-20 flex flex-col items-center>
+    <n-icon :component="Coffee" size="100" depth="3" />
+
+    <n-h1 m-0 mt-3>404 Not Found</n-h1>
+    <n-text mt-4 block depth="3">Sorry, this page does not seem to exist</n-text>
+    <n-text mb-8 block depth="3">Maybe the cache is doing tricky things, try force-refreshing?</n-text>
+
+    <router-link to="/" #="{ navigate, href }" custom>
+      <n-button tag="a" :href="href" secondary @click="navigate"> Back home </n-button>
+    </router-link>
   </div>
 </template>
-
-<style scoped>
-.e404-wrapper {
-  padding-top: 150px;
-}
-</style>