elmeg-demo/frontend/app/not-found.tsx
fullsizemalt c362a66618
Some checks are pending
Deploy Elmeg / deploy (push) Waiting to run
feat: add custom 404 page
2025-12-24 13:44:57 -08:00

43 lines
1.7 KiB
TypeScript

import Link from "next/link"
import { Button } from "@/components/ui/button"
import { Home, ArrowLeft, Search } from "lucide-react"
export default function NotFound() {
return (
<div className="min-h-[60vh] flex flex-col items-center justify-center text-center px-4">
<div className="space-y-6 max-w-md">
<div className="text-8xl font-bold text-muted-foreground/30">404</div>
<div className="space-y-2">
<h1 className="text-2xl font-bold">Page Not Found</h1>
<p className="text-muted-foreground">
The page you&apos;re looking for doesn&apos;t exist or may have been moved.
</p>
</div>
<div className="flex flex-col sm:flex-row gap-3 justify-center pt-4">
<Button asChild variant="default">
<Link href="/">
<Home className="mr-2 h-4 w-4" />
Go Home
</Link>
</Button>
<Button asChild variant="outline">
<Link href="/shows">
<Search className="mr-2 h-4 w-4" />
Browse Shows
</Link>
</Button>
</div>
<p className="text-sm text-muted-foreground pt-4">
Looking for a specific show? Try the{" "}
<Link href="/shows" className="underline hover:text-foreground">
shows page
</Link>{" "}
or use the search.
</p>
</div>
</div>
)
}