mirror of
https://github.com/jakejarvis/jarv.is.git
synced 2026-06-05 20:15:31 -04:00
b2416ff0db
- Replace single `<ViewTransition>` wrapper in layout with `FadeTransition` and `DirectionalTransition` components applied per page - Add `components/page-transition.tsx` with reusable transition wrappers - Expand view transition CSS with named classes: fade, slide, nav-forward/back, morph, text-morph, scale — all driven by CSS custom property durations - Use React `<ViewTransition name=... share="text-morph">` for shared note title element between list and detail views - Wrap comments suspense boundary with enter/exit slide transitions - Add `persistent-nav` and `persistent-footer` view-transition-name groups to keep chrome static during navigation - Fix reduced-motion override to target delay and duration instead of `animation: none` - Add tracking-tight and letter-spacing tweaks to home page typography
41 lines
993 B
TypeScript
41 lines
993 B
TypeScript
import type { Metadata } from "next";
|
|
import Link from "next/link";
|
|
|
|
import { FadeTransition } from "@/components/page-transition";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Video } from "@/components/video";
|
|
|
|
export const metadata: Metadata = {
|
|
title: "Page Not Found",
|
|
description: null,
|
|
openGraph: {},
|
|
alternates: {
|
|
canonical: null,
|
|
},
|
|
};
|
|
|
|
const Page = () => (
|
|
<FadeTransition>
|
|
<Video
|
|
src="https://ijyxfbpcm3itvdly.public.blob.vercel-storage.com/not-found-SAtLyNyc7gVhveYxr6o1ITd9CSXo5X.mp4"
|
|
autoPlay
|
|
className="mt-6 aspect-[16/11] max-w-[480px] rounded-lg"
|
|
/>
|
|
|
|
<div className="mt-6 text-center">
|
|
<h1 className="my-2 text-2xl font-semibold md:text-3xl">Page Not Found</h1>
|
|
|
|
<Button
|
|
className="mt-4 mb-0 text-[15px] leading-none"
|
|
size="lg"
|
|
nativeButton={false}
|
|
render={<Link href="/" />}
|
|
>
|
|
Go home?
|
|
</Button>
|
|
</div>
|
|
</FadeTransition>
|
|
);
|
|
|
|
export default Page;
|