konnosnot-found.tsx45 lines · main
| 1 | import Image from 'next/image'; |
| 2 | import Link from 'next/link'; |
| 3 | |
| 4 | export const metadata = { title: 'not found · briven' }; |
| 5 | |
| 6 | export default function NotFound() { |
| 7 | return ( |
| 8 | <main className="mx-auto flex min-h-dvh max-w-2xl flex-col justify-center gap-6 px-6 py-16 font-mono text-sm"> |
| 9 | <Link href="/" className="flex items-center gap-2" aria-label="briven home"> |
| 10 | <Image src="/icon.svg" alt="" width={28} height={28} priority /> |
| 11 | <span>briven</span> |
| 12 | </Link> |
| 13 | |
| 14 | <div> |
| 15 | <h1 className="text-2xl tracking-tight">404 · not found</h1> |
| 16 | <p className="mt-2 text-[var(--color-text-muted)]"> |
| 17 | the page you tried to reach doesn't exist. try one of these: |
| 18 | </p> |
| 19 | </div> |
| 20 | |
| 21 | <ul className="flex flex-col gap-2"> |
| 22 | {[ |
| 23 | { href: '/', label: 'home' }, |
| 24 | { href: '/signin', label: 'sign in / get started' }, |
| 25 | { href: 'https://docs.briven.tech', label: 'docs' }, |
| 26 | { href: 'https://docs.briven.tech/quickstart', label: 'quickstart' }, |
| 27 | { href: 'https://docs.briven.tech/status', label: 'status' }, |
| 28 | ].map((p) => ( |
| 29 | <li key={p.href}> |
| 30 | <Link |
| 31 | href={p.href} |
| 32 | className="block rounded-md border border-[var(--color-border-subtle)] bg-[var(--color-surface)] px-4 py-3 hover:border-[var(--color-border)]" |
| 33 | > |
| 34 | {p.label} → |
| 35 | </Link> |
| 36 | </li> |
| 37 | ))} |
| 38 | </ul> |
| 39 | |
| 40 | <footer className="mt-auto pt-8 font-mono text-[10px] text-[var(--color-text-subtle)]"> |
| 41 | built with <span className="text-[#e8344a]">♥</span> in Flanders · flndrn Limited |
| 42 | </footer> |
| 43 | </main> |
| 44 | ); |
| 45 | } |