70 lines
2.5 KiB
TypeScript
70 lines
2.5 KiB
TypeScript
import React from 'react';
|
|
import Link from 'next/link';
|
|
import { Button } from '@/components/ui/Button';
|
|
|
|
import '@/styles/globals.css';
|
|
|
|
export default function NotFound() {
|
|
return (
|
|
<html lang="en">
|
|
<body>
|
|
<div className="min-h-screen bg-white flex items-center justify-center px-4">
|
|
<div className="max-w-2xl w-full text-center">
|
|
{/* 404 Icon */}
|
|
<div className="mb-8">
|
|
<div className="inline-flex items-center justify-center w-24 h-24 bg-primary-100 rounded-full mb-6">
|
|
<svg
|
|
className="w-12 h-12 text-primary-600"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
viewBox="0 0 24 24"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<path
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
strokeWidth={2}
|
|
d="M9.172 16.172a4 4 0 015.656 0M9 10h.01M15 10h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
|
|
{/* 404 Text */}
|
|
<h1 className="text-6xl md:text-8xl font-bold text-gray-900 mb-4">404</h1>
|
|
<h2 className="text-2xl md:text-3xl font-semibold text-gray-700 mb-4">
|
|
Page Not Found
|
|
</h2>
|
|
<p className="text-lg text-gray-600 mb-8 max-w-md mx-auto">
|
|
Sorry, we couldn't find the page you're looking for. It might have been moved or deleted.
|
|
</p>
|
|
</div>
|
|
|
|
{/* Action Button */}
|
|
<div className="flex justify-center">
|
|
<Link href="/">
|
|
<Button size="lg">
|
|
<svg
|
|
className="w-5 h-5 mr-2"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
viewBox="0 0 24 24"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<path
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
strokeWidth={2}
|
|
d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6"
|
|
/>
|
|
</svg>
|
|
Back to Home
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|
|
);
|
|
}
|