custom 404 page
All checks were successful
Deploy / deploy (ubuntu-latest, 2.44.0) (push) Successful in 1m2s

Took 13 minutes
This commit is contained in:
Braydon 2024-10-09 14:28:54 -04:00
parent 876d0094ca
commit d4209bc23d
5 changed files with 34 additions and 3 deletions

BIN
public/media/mike.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 63 KiB

32
src/app/not-found.tsx Normal file
View File

@ -0,0 +1,32 @@
import { ReactElement } from "react";
import Image from "next/image";
/**
* The not found page.
*
* @return the page jsx
*/
const NotFoundPage = (): ReactElement => (
<main className="w-full pt-[25vh] min-h-screen flex justify-center select-none pointer-events-none">
<div className="h-fit flex gap-10">
{/* Image */}
<Image
src="/media/mike.png"
alt="Mike Wazowski"
width={128}
height={128}
draggable={false}
/>
{/* Message */}
<div className="flex flex-col gap-0.5">
<h1 className="text-3xl font-bold">Wrong Door!</h1>
<p className="max-w-72 text-lg opacity-75">
The documentation page you were looking for could not be
found.
</p>
</div>
</div>
</main>
);
export default NotFoundPage;

View File

@ -52,7 +52,7 @@ const QuickSearchDialog = ({
className="cursor-pointer hover:opacity-85 transition-all transform-gpu select-none"
onClick={() => setOpen(true)}
>
<div className="absolute top-2.5 left-3 z-10">
<div className="absolute top-[0.55rem] left-3 z-10">
<Search className="w-[1.15rem] h-[1.15rem]" />
</div>

View File

@ -22,7 +22,7 @@ const SocialLink = ({
<SimpleTooltip content={tooltip}>
<Link
className={cn(
"w-6 h-6 hover:opacity-75 transition-all transform-gpu",
"w-6 h-6 hover:opacity-75 transition-all transform-gpu select-none",
className
)}
href={href}

View File

@ -54,5 +54,4 @@ const ThemeSwitcher = (): ReactElement => {
</div>
);
};
export default ThemeSwitcher;