shishantbiswas/JustAnime
1
0
Fork 0
mirror of https://github.com/JustAnimeCore/JustAnime.git synced 2026-04-17 22:01:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

error page

Browse Source
This commit is contained in:
Tejas Panchal
2025-07-31 22:54:11 +05:30
parent a00b71da36
commit 0cccaaaf50
1 changed files with 17 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/error/Error.jsx
View File

@@ -4,14 +4,24 @@ import { useNavigate } from "react-router-dom"
function Error({ error }) {
const navigate = useNavigate();
return (
<div className="bg-[#201F31] w-full h-screen flex justify-center items-center">
<div className="w-full h-screen flex justify-center items-center">
<div className="flex flex-col w-fit h-fit items-center justify-center">
<img src="https://s1.gifyu.com/images/SBlOe.png" alt="" className="w-[300px] h-[300px] max-[500px]:w-[200px] max-[500px]:h-[200px]" />
<h1 className="text-white text-[35px] leading-5 mt-7">{error === "404" ? "404 Error" : "Error"}</h1>
<p className="mt-5">Oops! We couldn&apos;t find this page.</p>
<button className="bg-[#ffbade] py-2 px-4 w-fit rounded-3xl text-black text-light flex items-center gap-x-2 mt-7">
<FaChevronLeft className="text-[#ffbade] w-[20px] h-[20px] rounded-full p-1 bg-black" />
<p onClick={() => navigate('/home')} className="text-[18px]">Back to homepage</p>
<div className="w-[300px] h-[300px] max-[500px]:w-[200px] max-[500px]:h-[200px] relative overflow-hidden rounded-lg">
<img
src="https://64.media.tumblr.com/tumblr_lhnjv52vzw1qcrzkko1_500.gif"
alt="404 Error"
className="w-full h-full object-cover grayscale"
/>
<div className="absolute inset-0 bg-black/20"></div>
</div>
<h1 className="font-bold text-white text-[48px] mt-8 tracking-tight">{error === "404" ? "404 Error" : "Error"}</h1>
<p className="text-gray-400 text-lg mt-2">Oops! we couldn't find this page.</p>
<button
onClick={() => navigate('/home')}
className="mt-8 bg-[#ffbade] hover:bg-[#ffcbe7] transition-colors text-black py-2 px-4 w-fit rounded-3xl flex items-center gap-x-2"
>
<FaChevronLeft className="text-black w-[20px] h-[20px] rounded-full p-1" />
<span className="text-[18px]">Back to homepage</span>
</button>
</div>
</div>