livekit-examples
diff --git a/‎app/layout.tsx‎
Lines changed: 13 additions & 6 deletions b/‎app/layout.tsx‎
Lines changed: 13 additions & 6 deletions
diff --git a/‎app/ui/layout.tsx‎
Lines changed: 0 additions & 45 deletions b/‎app/ui/layout.tsx‎
Lines changed: 0 additions & 45 deletions
diff --git a/‎app/ui/page.tsx‎
Lines changed: 0 additions & 268 deletions b/‎app/ui/page.tsx‎
Lines changed: 0 additions & 268 deletions
@@ -1,7 +1,8 @@
 import { Public_Sans } from 'next/font/google';
 import localFont from 'next/font/local';
 import { headers } from 'next/headers';
-import { ApplyThemeScript, ThemeToggle } from '@/components/app/theme-toggle';
+import { ThemeProvider } from '@/components/app/theme-provider';
+import { ThemeToggle } from '@/components/app/theme-toggle';
 import { cn, getAppConfig, getStyles } from '@/lib/utils';
 import '@/styles/globals.css';
 
@@ -61,13 +62,19 @@ export default async function RootLayout({ children }: RootLayoutProps) {
         {styles && <style>{styles}</style>}
         <title>{pageTitle}</title>
         <meta name="description" content={pageDescription} />
-        <ApplyThemeScript />
       </head>
       <body className="overflow-x-hidden">
-        {children}
-        <div className="group fixed bottom-0 left-1/2 z-50 mb-2 -translate-x-1/2">
-          <ThemeToggle className="translate-y-20 transition-transform delay-150 duration-300 group-hover:translate-y-0" />
-        </div>
+        <ThemeProvider
+          attribute="class"
+          defaultTheme="system"
+          enableSystem
+          disableTransitionOnChange
+        >
+          {children}
+          <div className="group fixed bottom-0 left-1/2 z-50 mb-2 -translate-x-1/2">
+            <ThemeToggle className="translate-y-20 transition-transform delay-150 duration-300 group-hover:translate-y-0" />
+          </div>
+        </ThemeProvider>
       </body>
     </html>
   );