import type { Metadata, Viewport } from "next";
import { NuqsAdapter } from "nuqs/adapters/next/app";
import { SoundControl } from "@/components/sound-control";
import { ThemeProvider } from "@/components/theme-provider";
import { ThemeSwitcher } from "@/components/theme-switcher";
import "./globals.css";
export const metadata: Metadata = {
title: "QR Code Generator",
description: "Design beautiful QR codes with custom styles",
};
export const viewport: Viewport = {
width: "device-width",
initialScale: 1,
maximumScale: 5,
userScalable: true,
};
export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<html lang="en" suppressHydrationWarning>
<body>
<ThemeProvider
attribute="class"
defaultTheme="system"
disableTransitionOnChange
enableSystem
>
<NuqsAdapter>{children}</NuqsAdapter>
{/* Fixed UI controls in bottom right corner */}
<div className="fixed right-3 bottom-3 z-50 flex items-center gap-2 sm:right-6 sm:bottom-6 sm:gap-3">
<SoundControl />
<ThemeSwitcher />
</div>
</ThemeProvider>
</body>
</html>
);
}
