Ryan/documenso
1
0
Fork 1
mirror of https://github.com/documenso/documenso.git synced 2025-11-12 15:53:02 +10:00
Code Issues Packages Projects Releases Wiki Activity

fix: update styling

Browse Source
This commit is contained in:
Mythie
2023-09-05 13:15:45 +10:00
parent 4ec2bd7536
commit 4072e2a200
4 changed files with 110 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
apps/marketing/src/app/not-found.tsx
View File

@ -1,6 +1,7 @@
'use client';
import Image from 'next/image';
import Link from 'next/link';
import { useRouter } from 'next/navigation';
import { motion } from 'framer-motion';
@ -13,54 +14,52 @@ import backgroundPattern from '~/assets/background-pattern.png';
export default function NotFound() {
const router = useRouter();
return (
<motion.div className={cn('relative')}>
<div className={cn('relative max-w-[100vw] overflow-hidden')}>
<div className="absolute -inset-24 -z-10">
<motion.div
className="flex h-full w-full origin-top-right items-center justify-center"
initial="initial"
animate="animate"
className="flex h-full w-full items-center justify-center"
initial={{ opacity: 0 }}
animate={{ opacity: 0.8, transition: { duration: 0.5, delay: 0.5 } }}
>
<Image
src={backgroundPattern}
alt="background pattern"
className="-mr-[50vw] -mt-[15vh] h-full scale-100 object-cover md:scale-100 lg:scale-[100%]"
priority={true}
priority
/>
</motion.div>
</div>
<div className="container mx-auto flex min-h-screen items-center px-6 py-12">
<div className="mx-auto flex max-w-sm flex-col items-center text-center">
<h1 className="mt-3 text-2xl font-semibold text-gray-800 dark:text-white md:text-3xl">
404 Page not found
</h1>
<p className="mt-4 text-gray-500 dark:text-gray-400">
Sorry, the page you are looking for doesn't exist or has been moved.
<div className="container mx-auto flex h-full min-h-screen items-center px-6 py-32">
<div>
<p className="text-muted-foreground font-semibold">404 Page not found</p>
<h1 className="mt-3 text-2xl font-bold md:text-3xl">Oops! Something went wrong.</h1>
<p className="text-muted-foreground mt-4 text-sm">
The page you are looking for was moved, removed, renamed or might never have existed.
</p>
<div className="mt-6 flex w-full shrink-0 items-center gap-x-3 sm:w-auto">
<div className="mt-6 flex gap-x-2.5 gap-y-4 md:items-center">
<Button
size="default"
variant="ghost"
className="w-32"
onClick={() => {
void router.back();
}}
className="dark:bg-documenso dark:hover:opacity-90"
>
<ChevronLeft />
<span>Go back</span>
<ChevronLeft className="mr-2 h-4 w-4" />
Go Back
</Button>
<Button
size="default"
onClick={() => {
void router.push('/');
}}
variant="secondary"
>
<span>Home</span>
<Button className="w-32" asChild>
<Link href="/">Home</Link>
</Button>
</div>
</div>
</div>
</motion.div>
</div>
);
}