From eef495e80991ca3469b452947ad35b2740981338 Mon Sep 17 00:00:00 2001
From: trafficlunar <hello@trafficlunar.net>
Date: Fri, 18 Apr 2025 18:10:03 +0100
Subject: [PATCH] style: redesign 404 page

---
 src/app/not-found.tsx | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/src/app/not-found.tsx b/src/app/not-found.tsx
index de82f3d..b8b8190 100644
--- a/src/app/not-found.tsx
+++ b/src/app/not-found.tsx
@@ -1,13 +1,17 @@
 import Link from "next/link";
+import { Icon } from "@iconify/react";
 
 export default function NotFound() {
 	return (
-		<div className="flex flex-col items-center">
-			<h2 className="text-7xl font-black">404</h2>
-			<p className="text-xl">Page not found</p>
-			<Link href="/" className="pill button mt-8">
-				Return Home
-			</Link>
+		<div className="flex-grow flex items-center justify-center">
+			<div className="bg-amber-50 border-2 border-amber-500 rounded-2xl shadow-lg p-8 max-w-xs w-full text-center flex flex-col">
+				<h2 className="text-7xl font-black">404</h2>
+				<p>Page not found</p>
+				<Link href="/" className="pill button gap-1 mt-8 w-fit self-center">
+					<Icon icon="ic:round-home" fontSize={22} />
+					Return Home
+				</Link>
+			</div>
 		</div>
 	);
 }