Make Status404 page inline (#3929)

This commit is contained in:
Jonathan Dobson
2025-11-06 13:35:36 -05:00
committed by GitHub
parent 8482ff4a75
commit 28f7dcc1a7

View File

@@ -2,7 +2,11 @@ import "./Status404.css";
function Status404() {
return (
<div className="fixed inset-0 z-50 bg-background">
<div
className="relative z-50 flex w-full items-center justify-center bg-background"
// hack(jdo): 7.5rem is header height; this is a fail, IMO; we should redo root layout CSS
style={{ height: "calc(100vh - 7.5rem)" }}
>
<div className="absolute flex h-full w-full items-center justify-center">
<div className="animate-roll-right-404 relative flex h-[13rem] w-[13rem] flex-col items-center justify-center rounded-full bg-white/5 text-xl font-bold text-white">
<div className="animate-fade-in-404">404</div>
@@ -13,11 +17,7 @@ function Status404() {
</div>
</div>
<div className="absolute flex h-full w-full items-center justify-center">
<img
src="/404-sad-dragon-md.png"
alt="404 Not Found"
className="max-h-screen max-w-2xl object-contain"
/>
<img src="/404-sad-dragon-md.png" alt="404 Not Found" />
</div>
</div>
);