68 lines
1.9 KiB
TypeScript
68 lines
1.9 KiB
TypeScript
import type { Metadata, Viewport } from "next";
|
|
import { Cormorant_Garamond, Source_Sans_3 } from "next/font/google";
|
|
import { TRPCReactProvider } from "@/trpc/react";
|
|
import { ThemeProvider } from "@/components/theme-provider";
|
|
import { SiteHeader } from "@/components/site-header";
|
|
import { Toaster } from "@/components/ui/sonner";
|
|
import { BRAND_NAME, BRAND_TITLE } from "@/lib/brand";
|
|
import "./globals.css";
|
|
|
|
const sourceSans = Source_Sans_3({
|
|
variable: "--font-source-sans",
|
|
subsets: ["latin"],
|
|
display: "swap",
|
|
});
|
|
|
|
const cormorant = Cormorant_Garamond({
|
|
variable: "--font-cormorant",
|
|
subsets: ["latin"],
|
|
display: "swap",
|
|
weight: ["500", "600", "700"],
|
|
});
|
|
|
|
export const metadata: Metadata = {
|
|
applicationName: BRAND_NAME,
|
|
title: {
|
|
default: BRAND_TITLE,
|
|
template: `%s · ${BRAND_NAME}`,
|
|
},
|
|
description:
|
|
"Guests upload photos. Event people choose what appears in the gallery.",
|
|
};
|
|
|
|
export const viewport: Viewport = {
|
|
themeColor: [
|
|
{ media: "(prefers-color-scheme: light)", color: "#f4eee4" },
|
|
{ media: "(prefers-color-scheme: dark)", color: "#2a231c" },
|
|
],
|
|
viewportFit: "cover",
|
|
};
|
|
|
|
export default function RootLayout({
|
|
children,
|
|
}: Readonly<{ children: React.ReactNode }>) {
|
|
return (
|
|
<html
|
|
lang="en"
|
|
className={`${sourceSans.variable} ${cormorant.variable} font-sans`}
|
|
suppressHydrationWarning
|
|
>
|
|
<body>
|
|
<ThemeProvider>
|
|
<TRPCReactProvider>
|
|
<a
|
|
href="#main"
|
|
className="sr-only focus:not-sr-only focus:absolute focus:top-3 focus:left-3 focus:z-50 focus:rounded-lg focus:bg-card focus:px-3 focus:py-2 focus:text-sm"
|
|
>
|
|
Skip to content
|
|
</a>
|
|
<SiteHeader />
|
|
<div id="main">{children}</div>
|
|
<Toaster position="top-center" />
|
|
</TRPCReactProvider>
|
|
</ThemeProvider>
|
|
</body>
|
|
</html>
|
|
);
|
|
}
|