centered and blended 404 page

This commit is contained in:
chark1es 2025-01-06 18:35:43 -08:00
parent 4d197b9ed6
commit 2a44075f2a

View file

@ -4,19 +4,24 @@ import Link from "next/link";
--- ---
<Layout> <Layout>
<div class="h-screen w-full flex items-center justify-center">
<div class = "w-fit h-fit flex flex-col items-center relative"> <div class="flex flex-col items-center relative">
<img
<img src = "/404.png" alt = "404 shing" class = "mr-[11%]"> src="/404.png"
<div class = "flex flex-col items-center absolute bottom-[37%]"> alt="404 shing"
<p class = "font-extralight text-[1.2vw]"> class="mr-[11%] [mask-image:radial-gradient(circle,black_10%,transparent_100%)]"
Oops! You're Lost in the Circuit! 🔌⚡ />
</p> <div class="flex flex-col items-center absolute bottom-[27%]">
<Link href = "/" className = "border-white/80 border-[0.12vw] rounded-[0.7vw] px-[8.5vw] py-[3%] font-extralight text-[1.2vw] mt-[3%] hover:text-ieee-yellow hover:border-ieee-yellow duration-300"> <p class="font-extralight text-[1.2vw]">
Go Back Home Oops! You're Lost in the Circuit! 🔌⚡
</Link> </p>
<Link
href="/"
className="border-white/80 border-[0.12vw] rounded-[0.7vw] px-[8.5vw] py-[3%] font-extralight text-[1.2vw] mt-[3%] hover:text-ieee-yellow hover:border-ieee-yellow duration-300"
>
Go Back Home
</Link>
</div>
</div> </div>
</div> </div>
</Layout> </Layout>