ilia
c011c8078e
Add next-themes light/dark/system theming with an accessible toggle in every header, and close out an a11y pass across the viewer app: skip-to-content link, main landmarks and heading hierarchy on every route, focus-trapped dialog semantics for the photo viewer modals, aria-label/live-region coverage for dynamic messages and icon buttons, and dark: variants for previously light-only colors.
40 lines
1.2 KiB
TypeScript
40 lines
1.2 KiB
TypeScript
import type { Metadata } from "next";
|
|
import { Inter } from "next/font/google";
|
|
import { SessionProviderWrapper } from "@/components/SessionProviderWrapper";
|
|
import { ThemeProviderWrapper } from "@/components/ThemeProviderWrapper";
|
|
import "./globals.css";
|
|
|
|
const inter = Inter({
|
|
subsets: ["latin"],
|
|
variable: "--font-inter",
|
|
});
|
|
|
|
export const metadata: Metadata = {
|
|
title: "PunimTag Photo Viewer",
|
|
description: "Browse and search your family photos",
|
|
};
|
|
|
|
export default function RootLayout({
|
|
children,
|
|
}: Readonly<{
|
|
children: React.ReactNode;
|
|
}>) {
|
|
return (
|
|
<html lang="en" suppressHydrationWarning>
|
|
<body className={`${inter.variable} font-sans antialiased`}>
|
|
<a
|
|
href="#main-content"
|
|
className="sr-only focus:not-sr-only focus:absolute focus:left-4 focus:top-4 focus:z-[200] focus:rounded-md focus:bg-primary focus:px-4 focus:py-2 focus:text-primary-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring"
|
|
>
|
|
Skip to main content
|
|
</a>
|
|
<ThemeProviderWrapper>
|
|
<SessionProviderWrapper>
|
|
{children}
|
|
</SessionProviderWrapper>
|
|
</ThemeProviderWrapper>
|
|
</body>
|
|
</html>
|
|
);
|
|
}
|