From 2f68e2b2f6381054dd3457c595ee8339f7ec4dac Mon Sep 17 00:00:00 2001
From: Alliana <56180684+Allianaab2m@users.noreply.github.com>
Date: Sat, 10 Aug 2024 03:21:05 +0900
Subject: [PATCH] feat: add 404 page (#141)

---
 src/pages/404.astro | 24 ++++++++++++++++++++++++
 1 file changed, 24 insertions(+)
 create mode 100644 src/pages/404.astro

diff --git a/src/pages/404.astro b/src/pages/404.astro
new file mode 100644
index 00000000..9bcffc24
--- /dev/null
+++ b/src/pages/404.astro
@@ -0,0 +1,24 @@
+---
+import MainGridLayout from '@layouts/MainGridLayout.astro'
+import { url } from '@utils/url-utils'
+import { Icon } from 'astro-icon/components'
+---
+
+<MainGridLayout title="Not found">
+  <div class="w-full rounded-[var(--radius-large)] overflow-hidden relative min-h-32">
+    <div class="card-base z-10 px-9 py-6 relative w-full text-black/75 dark:text-white/75">
+      <div class="flex items-center gap-4">
+        <h1 class="text-[5rem] font-bold">404</h1>
+        <p class="text-[2rem]">Not found</p>
+      </div>
+      <a href={url("/")} class:list={["font-bold overflow-hidden active:scale-95"]}>
+        <div class="btn-card max-w-fit rounded-2xl h-[3.75rem] px-4 flex items-center justify-start gap-2">
+          <div class="overflow-hidden transition overflow-ellipsis whitespace-nowrap text-black/75 dark:text-white/75">
+            Return to top page
+          </div>
+          <Icon name="material-symbols:chevron-right-rounded" class="text-[1.75rem] text-black/75 dark:text-white/75" />
+        </div>
+      </a>
+    </div>
+  </div>
+</MainGridLayout>