soconnor
fe52916d84
- globals.css: add blob keyframe animation (9s ease-in-out infinite) - layout.tsx: add fixed background layer with 24px grid pattern and two animated blurred blobs (primary/5 color) that drift behind all content - Navigation.tsx: bg-background/80 + backdrop-blur-md + border-border/50 - Sidebar.tsx: same glassmorphism treatment - card.tsx: rounded-2xl (up from rounded-lg), bg-card/80 + backdrop-blur-sm so the blob color bleeds subtly through card surfaces Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
73 lines
2.6 KiB
TypeScript
73 lines
2.6 KiB
TypeScript
import Script from "next/script";
|
|
import type { Metadata } from "next";
|
|
import { env } from "~/env";
|
|
import { Footer } from "~/components/Footer";
|
|
import { Navigation } from "~/components/Navigation";
|
|
import { Sidebar } from "~/components/Sidebar";
|
|
import { BreadcrumbWrapper } from "~/components/BreadcrumbWrapper";
|
|
import { BreadcrumbProvider } from "~/context/BreadcrumbContext";
|
|
|
|
import { playfair } from "~/lib/fonts";
|
|
import { description, name } from "~/lib/data";
|
|
import "~/styles/globals.css";
|
|
import { Inter } from "next/font/google";
|
|
import { cn } from "~/lib/utils";
|
|
|
|
const inter = Inter({subsets:['latin'],variable:'--font-sans'});
|
|
|
|
export const metadata: Metadata = {
|
|
title: `${name[0]?.first} ${name[0]?.last}`,
|
|
description: description,
|
|
icons: [{ rel: "icon", url: "/favicon.ico" }],
|
|
};
|
|
|
|
export default function RootLayout({ children }: React.PropsWithChildren) {
|
|
return (
|
|
<html
|
|
lang="en"
|
|
className={cn(inter.variable, playfair.variable, "font-sans", inter.variable)}
|
|
suppressHydrationWarning
|
|
>
|
|
<body
|
|
className="flex min-h-screen flex-col bg-background font-sans text-foreground"
|
|
suppressHydrationWarning
|
|
>
|
|
|
|
{env.NEXT_PUBLIC_UMAMI_WEBSITE_ID && (
|
|
<Script
|
|
defer
|
|
src={
|
|
env.NEXT_PUBLIC_UMAMI_SCRIPT_URL ??
|
|
"https://analytics.umami.is/script.js"
|
|
}
|
|
data-website-id={env.NEXT_PUBLIC_UMAMI_WEBSITE_ID}
|
|
/>
|
|
)}
|
|
|
|
{/* Living background */}
|
|
<div className="pointer-events-none fixed inset-0 -z-10 overflow-hidden">
|
|
<div className="absolute inset-0 bg-[linear-gradient(to_right,#80808010_1px,transparent_1px),linear-gradient(to_bottom,#80808010_1px,transparent_1px)] bg-[size:24px_24px]" />
|
|
<div className="animate-blob absolute left-[45%] top-[30%] h-[700px] w-[700px] rounded-full bg-primary/5 blur-3xl" />
|
|
<div className="animate-blob absolute right-[20%] top-[60%] h-[500px] w-[500px] rounded-full bg-primary/4 blur-3xl [animation-delay:3s]" />
|
|
</div>
|
|
|
|
<BreadcrumbProvider>
|
|
<Navigation />
|
|
<div className="flex flex-1 flex-col pt-16 lg:flex-row">
|
|
<Sidebar />
|
|
<div className="min-w-0 flex-1 lg:pl-80">
|
|
<div className="mx-auto max-w-screen-xl px-4 sm:px-6 lg:pl-0 lg:pr-6">
|
|
<main className="p-4 pb-6 pt-6 sm:p-6 sm:pb-8 sm:pt-8">
|
|
<BreadcrumbWrapper />
|
|
{children}
|
|
</main>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</BreadcrumbProvider>
|
|
<Footer />
|
|
</body>
|
|
</html>
|
|
);
|
|
}
|