33 lines
1.2 KiB
JavaScript
33 lines
1.2 KiB
JavaScript
import React from "react";
|
|
import { useNavigate } from "react-router-dom";
|
|
import Footer from "../../nav/Footer";
|
|
import GlobalAnimatedBackground from "../../../background/GlobalAnimatedBackground";
|
|
|
|
const NotFoundPage = () => {
|
|
const navigate = useNavigate();
|
|
|
|
return (
|
|
<div className="relative flex flex-col min-h-screen overflow-hidden">
|
|
<GlobalAnimatedBackground />
|
|
<div className="flex-grow flex flex-col items-center justify-center z-10 relative">
|
|
<div className="bg-white rounded-xl shadow-2xl px-10 py-12 max-w-md w-full text-center">
|
|
<h1 className="text-7xl font-extrabold text-blue-600 mb-4">404</h1>
|
|
<h2 className="text-3xl font-bold text-gray-800 mb-2">Page Not Found</h2>
|
|
<p className="text-gray-500 mb-6">
|
|
Sorry, the page you are looking for does not exist or has been moved.
|
|
</p>
|
|
<button
|
|
onClick={() => navigate("/login")}
|
|
className="px-6 py-3 bg-blue-600 text-white rounded-lg shadow hover:bg-blue-700 transition"
|
|
>
|
|
Go back to Login
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<Footer />
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default NotFoundPage;
|