yiekheng
3bfd35ef8d
Adds viewportFit: 'cover' so the PWA can draw under the notch / Dynamic Island when installed. Nav and Toast read env(safe-area-inset-*) to keep their content out of the hardware cutouts (no-op on browsers without a notch — env() resolves to 0). Replaces autoFocus on the first field of CreateAccountDialog and CreateUserDialog with a useEffect that only focuses on pointer devices (matchMedia '(hover: hover) and (pointer: fine)'). Phones no longer get the soft keyboard popping the instant a dialog opens.
37 lines
990 B
TypeScript
37 lines
990 B
TypeScript
import "./globals.css";
|
|
import type { Metadata, Viewport } from "next";
|
|
import Nav from "@/components/nav";
|
|
import AutoRefresh from "@/components/auto-refresh";
|
|
|
|
export const metadata: Metadata = {
|
|
title: "CM Bot V2",
|
|
description: "CM Bot account and user dashboard",
|
|
};
|
|
|
|
export const viewport: Viewport = {
|
|
themeColor: "#18181b",
|
|
// Lets the page draw under the iPhone notch / Dynamic Island when the
|
|
// PWA runs in standalone mode. Components that pin to the edges (Nav,
|
|
// Toast) read env(safe-area-inset-*) to keep their content out of the
|
|
// hardware cutouts.
|
|
viewportFit: "cover",
|
|
};
|
|
|
|
export default function RootLayout({
|
|
children,
|
|
}: {
|
|
children: React.ReactNode;
|
|
}) {
|
|
return (
|
|
<html lang="en">
|
|
<body className="min-h-screen bg-zinc-50 text-zinc-900 antialiased">
|
|
<Nav />
|
|
<main className="mx-auto max-w-6xl px-4 pb-16 pt-8 sm:px-6 sm:pt-12">
|
|
{children}
|
|
</main>
|
|
<AutoRefresh />
|
|
</body>
|
|
</html>
|
|
);
|
|
}
|