Next's fallback-metrics table has no entry for this (newer, merged variable-font) family name, so the CLS-reducing fallback override it tries to generate always fails with a build warning. Correctly suppresses it under webpack; Turbopack (this project's default builder) doesn't yet honor the flag the same way, so the warning still prints there today, but the setting is still the semantically correct declaration of intent and forward-compatible. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_012hQoM3jJT1Lx7CMTciMzvD
51 lines
1.6 KiB
TypeScript
51 lines
1.6 KiB
TypeScript
import type { Metadata, Viewport } from "next";
|
|
import { Big_Shoulders, Space_Grotesk, IBM_Plex_Mono } from "next/font/google";
|
|
import RegisterServiceWorker from "@/components/RegisterServiceWorker";
|
|
import "./globals.css";
|
|
|
|
const bigShoulders = Big_Shoulders({
|
|
variable: "--font-big-shoulders",
|
|
weight: ["700", "900"],
|
|
subsets: ["latin"],
|
|
// Next's fallback-metrics table has no entry for this (newer, merged
|
|
// variable-font) family name, so the automatic CLS-reducing fallback
|
|
// override it would otherwise generate always fails with a build
|
|
// warning — opt out instead of leaving that warning unresolved.
|
|
adjustFontFallback: false,
|
|
});
|
|
|
|
const spaceGrotesk = Space_Grotesk({
|
|
variable: "--font-space-grotesk",
|
|
subsets: ["latin"],
|
|
});
|
|
|
|
const plexMono = IBM_Plex_Mono({
|
|
variable: "--font-plex-mono",
|
|
weight: ["400", "500", "600"],
|
|
subsets: ["latin"],
|
|
});
|
|
|
|
export const metadata: Metadata = {
|
|
title: "vpinball — Visual Pinball in your browser",
|
|
description:
|
|
"Play real .vpx pinball tables in the browser, powered by a WebAssembly build of Visual Pinball. Drop in your own table or play the bundled demo.",
|
|
};
|
|
|
|
export const viewport: Viewport = {
|
|
themeColor: "#0b0b0f",
|
|
};
|
|
|
|
export default function RootLayout({ children }: LayoutProps<"/">) {
|
|
return (
|
|
<html
|
|
lang="en"
|
|
className={`${bigShoulders.variable} ${spaceGrotesk.variable} ${plexMono.variable} h-full antialiased`}
|
|
>
|
|
<body className="min-h-full flex flex-col bg-ink text-paper font-body">
|
|
{children}
|
|
<RegisterServiceWorker />
|
|
</body>
|
|
</html>
|
|
);
|
|
}
|