From e20a41014a928e1dbbdaa45bbde2f6363dab4c20 Mon Sep 17 00:00:00 2001
From: jakubmanczak <jakub@manczak.net>
Date: Thu, 22 Dec 2022 17:02:00 +0100
Subject: [PATCH] custom 404 design

---
 pages/404.tsx | 43 ++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 42 insertions(+), 1 deletion(-)

diff --git a/pages/404.tsx b/pages/404.tsx
index d5915b5..4b89920 100644
--- a/pages/404.tsx
+++ b/pages/404.tsx
@@ -1,10 +1,51 @@
 import { SEO } from "../components/SEO";
+import { useRouter } from "next/router";
+import Link from "next/link";
 
 const PageError404 = () => {
+	const router = useRouter();
 	return (
 		<>
 			<SEO title="404" />
-			<main>Error 404 - nie znaleziono takiego URL.</main>
+			<div
+				style={{
+					display: "flex",
+					justifyContent: "center",
+					userSelect: "none",
+				}}
+			>
+				<div
+					style={{ textAlign: "center", position: "relative", width: "320px" }}
+				>
+					<h1 style={{ fontSize: "8rem", zIndex: -1 }}>404</h1>
+					<p
+						style={{
+							position: "absolute",
+							fontSize: "1.2rem",
+							left: "174px",
+							bottom: "36px",
+							background: "var(--black0)",
+							padding: "0 4px",
+							borderTopLeftRadius: "4px",
+						}}
+					>
+						ERROR
+					</p>
+				</div>
+			</div>
+			<p style={{ textAlign: "center", lineHeight: "1.5rem" }}>
+				<span
+					style={{
+						padding: "4px",
+						background: "var(--black1)",
+						borderRadius: "4px",
+						boxShadow: "var(--shadow0)",
+					}}
+				>
+					{useRouter().asPath}
+				</span>{" "}
+				nie jest poprawnym adresem.
+			</p>
 		</>
 	);
 };