From 81de0b4355fc10f95006dbdcc8033ef45c7a376c Mon Sep 17 00:00:00 2001
From: Gerald Leban <gerald.leban0@gmail.com>
Date: Mon, 5 Oct 2026 16:17:44 +0200
Subject: [PATCH] feat(errors): redesign 404 page with neobrutalism style

---
 inertia/pages/errors/not_found.tsx | 40 +++++++++++++++---------------
 1 file changed, 20 insertions(+), 20 deletions(-)

diff --git a/inertia/pages/errors/not_found.tsx b/inertia/pages/errors/not_found.tsx
index 2957f1a..44b587e 100644
--- a/inertia/pages/errors/not_found.tsx
+++ b/inertia/pages/errors/not_found.tsx
@@ -1,5 +1,6 @@
 import BaseLayout from '~/layouts/base'
 import { Link } from '@adonisjs/inertia/react'
+import { Button } from '~/components/ui/button'
 
 interface NotFoundProps {
   handle?: string
@@ -9,28 +10,27 @@ export default function NotFound({ handle }: NotFoundProps) {
   const displayHandle = handle ? (handle.startsWith('@') ? handle : `@${handle}`) : null
 
   return (
-    <div className="home">
-      <article className="prose-card">
-        <div className="pc-top">
-          <span className="pc-status mono tag" style={{ color: 'var(--subtle)' }}>
-            <span className="dot" /> 404
-          </span>
+    <div className="flex min-h-[calc(100svh-3.5rem)] items-center justify-center px-4">
+      <div className="w-full max-w-md border-2 border-black bg-card shadow-[6px_6px_0px_0px_rgba(0,0,0,1)]">
+        <div className="border-b-2 border-black bg-primary px-6 py-4">
+          <span className="font-mono text-sm font-bold">404</span>
         </div>
-        <div className="pc-lead">
-          <span>{displayHandle ? 'Nobody by that name' : 'Not found.'}</span>
-          {!displayHandle && <em>That route hasn&apos;t been built yet.</em>}
+        <div className="px-6 py-8">
+          <h1 className="font-head text-3xl font-bold">
+            {displayHandle ? 'Nobody by that name' : 'Not found'}
+          </h1>
+          <p className="mt-3 text-sm text-muted-foreground">
+            {displayHandle
+              ? `${displayHandle} does not resolve to an account. The handle may be mistyped, or its owner may have changed it.`
+              : "The page you tried to reach doesn't exist. Check the URL or head back home."}
+          </p>
+          <div className="mt-6">
+            <Button size="sm" render={<Link route="home" />}>
+              Back to home
+            </Button>
+          </div>
         </div>
-        <p className="pc-para">
-          {displayHandle
-            ? `${displayHandle} does not resolve to an account. The handle may be mistyped, or its owner may have changed it.`
-            : "The page you tried to reach doesn't exist. Check the URL or head back home."}
-        </p>
-        <div style={{ marginTop: '1.5rem' }}>
-          <Link route="home" className="btn btn--secondary btn--sm">
-            Back to the feed
-          </Link>
-        </div>
-      </article>
+      </div>
     </div>
   )
 }
-- 
2.54.0