55 lines
1.7 KiB
JavaScript
55 lines
1.7 KiB
JavaScript
import Image from "next/image";
|
|
import Link from "next/link";
|
|
|
|
import { Button } from "@/components/ui/button";
|
|
import { BlurFade } from "@/components/magicui/blur-fade";
|
|
|
|
const BLUR_FADE_DELAY = 0.01;
|
|
|
|
export default function NotFoundPage() {
|
|
return (
|
|
<main
|
|
className="fixed inset-0 flex flex-col items-center justify-center bg-background"
|
|
>
|
|
<div className="flex flex-col items-center space-y-6 text-center max-w-lg w-full p-6">
|
|
|
|
<BlurFade delay={BLUR_FADE_DELAY * 1}>
|
|
<Image
|
|
src="/images/404.jpg"
|
|
alt="A lost robot in a desert, indicating a 404 page not found error."
|
|
width={400}
|
|
height={300}
|
|
className="rounded-lg shadow-lg"
|
|
/>
|
|
</BlurFade>
|
|
|
|
<BlurFade delay={BLUR_FADE_DELAY * 2}>
|
|
<h1 className="text-4xl font-bold tracking-tight">
|
|
Lost in the Digital Sands
|
|
</h1>
|
|
</BlurFade>
|
|
|
|
<BlurFade delay={BLUR_FADE_DELAY * 3}>
|
|
<p className="text-muted-foreground">
|
|
It seems the page you are looking for does not exist, has been moved,
|
|
or is currently unavailable.
|
|
</p>
|
|
</BlurFade>
|
|
|
|
<BlurFade delay={BLUR_FADE_DELAY * 4}>
|
|
<div className="flex flex-wrap items-center justify-center gap-2">
|
|
<Link href="/">
|
|
<Button>Go to Homepage</Button>
|
|
</Link>
|
|
<Link href="/publications">
|
|
<Button variant="outline">View Publications</Button>
|
|
</Link>
|
|
<Link href="/#contact">
|
|
<Button variant="outline">Contact Me</Button>
|
|
</Link>
|
|
</div>
|
|
</BlurFade>
|
|
</div>
|
|
</main>
|
|
);
|
|
} |