From b2a0ad17d4306e716ae7af6b846c26730fb4c149 Mon Sep 17 00:00:00 2001
From: Theophilus <60826700+Extheoisah@users.noreply.github.com>
Date: Wed, 26 Jun 2024 18:05:50 +0100
Subject: [PATCH] feat: add 404 page component (#136)

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

diff --git a/src/pages/404.tsx b/src/pages/404.tsx
new file mode 100644
index 0000000..cdb509c
--- /dev/null
+++ b/src/pages/404.tsx
@@ -0,0 +1,37 @@
+import Link from "next/link";
+
+import Footer from "@/components/footer/Footer";
+import NavBar from "@/components/navBar/NavBar";
+
+export default function Custom404() {
+  return (
+    <div className={`bg-custom-background text-custom-primary-text`}>
+      <main
+        id="main"
+        className="min-h-[calc(100dvh-122px)] flex w-full items-center pt-[60px] pb-[60px]"
+      >
+        <NavBar />
+        <div className={`App btc-search w-full`}>
+          <div className="flex flex-col items-center justify-center gap-y-2 w-full h-full">
+            <h1 className="md:text-4xl font-bold text-center">
+              404 - Page Not Found
+            </h1>
+            <p className="text-sm md:text-lg text-center max-w-xs md:max-w-lg">
+              The page you are looking for might have been removed, had its name
+              changed or is temporarily unavailable.
+            </p>
+            <Link
+              href="/"
+              className="text-custom-brightOrange-200 underline underline-offset-2"
+            >
+              Go to Homepage
+            </Link>
+          </div>
+        </div>
+      </main>
+      <section>
+        <Footer />
+      </section>
+    </div>
+  );
+}