mirror of
https://github.com/jakejarvis/sofa.git
synced 2026-08-29 05:05:38 -04:00
jakeandClaude Opus 4.6
fc982bee1b
- Add global MotionConfig reducedMotion="user" in root layout
- Add color-scheme: dark, theme-color meta, skip-to-main-content link
- Add aria-hidden={true} to ~60+ decorative icons across 33 files
- Add aria-label to all icon-only buttons (logout, star rating, play, delete, etc.)
- Replace transition-all with specific properties (11 files)
- Add motion-safe: prefix for CSS hover transforms and animate-pulse
- Add prefers-reduced-motion: reduce override in globals.css
- Add useReducedMotion guard to status-dot pulsing animation
- Fix focus-visible styles on auth form inputs (focus → focus-visible, stronger ring)
- Add text-balance to all headings (13 files)
- Replace "..." with "…" (U+2026) in all loading/placeholder text
- Add autocomplete, spellCheck, role="alert" to auth form
- Add aria-label to Switch controls and filmography select
- Fix heading hierarchy (h3 → h2 where h2 was skipped)
- Add break-words to title overview, overscroll-contain to drawer
- Add confirmation dialog for destructive library removal
- Add group-focus-within:opacity-100 for keyboard-accessible backup actions
- Add role="radio" + aria-checked to star rating buttons
- Add aria-label to carousel region, role="img" to TMDB logo SVG
- Add text-foreground to native select for dark mode consistency
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
56 lines
1.5 KiB
TypeScript
56 lines
1.5 KiB
TypeScript
import { MotionConfig } from "motion/react";
|
|
import type { Metadata } from "next";
|
|
import { DM_Sans, DM_Serif_Display, Geist_Mono } from "next/font/google";
|
|
import { TooltipProvider } from "@/components/ui/tooltip";
|
|
|
|
import "./globals.css";
|
|
import { Toaster } from "@/components/ui/sonner";
|
|
|
|
const dmSans = DM_Sans({
|
|
variable: "--font-dm-sans",
|
|
subsets: ["latin"],
|
|
});
|
|
|
|
const dmSerif = DM_Serif_Display({
|
|
variable: "--font-dm-serif",
|
|
weight: "400",
|
|
subsets: ["latin"],
|
|
});
|
|
|
|
const geistMono = Geist_Mono({
|
|
variable: "--font-geist-mono",
|
|
subsets: ["latin"],
|
|
});
|
|
|
|
export const metadata: Metadata = {
|
|
title: "Sofa",
|
|
description: "Track your movies and TV shows",
|
|
themeColor: "#090706",
|
|
};
|
|
|
|
export default function RootLayout({
|
|
children,
|
|
}: Readonly<{
|
|
children: React.ReactNode;
|
|
}>) {
|
|
return (
|
|
<html lang="en" style={{ colorScheme: "dark" }}>
|
|
<body
|
|
className={`${dmSans.variable} ${dmSerif.variable} ${geistMono.variable} overflow-x-hidden font-sans antialiased`}
|
|
style={{ touchAction: "manipulation" }}
|
|
>
|
|
<a
|
|
href="#main-content"
|
|
className="sr-only focus:not-sr-only focus:fixed focus:top-4 focus:left-4 focus:z-50 focus:px-4 focus:py-2 focus:bg-primary focus:text-primary-foreground focus:rounded-md"
|
|
>
|
|
Skip to main content
|
|
</a>
|
|
<MotionConfig reducedMotion="user">
|
|
<TooltipProvider>{children}</TooltipProvider>
|
|
</MotionConfig>
|
|
<Toaster position="bottom-right" />
|
|
</body>
|
|
</html>
|
|
);
|
|
}
|