feat(theme): add appearance settings and theme provider integration

- Added theme selection in settings page for light, dark, and system modes. - Integrated ThemeProvider into application layout. - Updated dashboard layout to include theme toggle in the header.
2026-01-20 16:27:59 +01:00
parent 3b9b73bc4b
commit 5cc77ae5b0
3 changed files with 76 additions and 6 deletions
--- a/frontend/src/app/layout.tsx
+++ b/frontend/src/app/layout.tsx
@@ -2,6 +2,7 @@ import type { Metadata } from "next";
 import { Ubuntu_Mono, Ubuntu_Sans } from "next/font/google";
 import { Toaster } from "@/components/ui/sonner";
 import { AuthProvider } from "@/providers/auth-provider";
+import { ThemeProvider } from "@/providers/theme-provider";
 import "./globals.css";

 const ubuntuSans = Ubuntu_Sans({
@@ -60,10 +61,17 @@ export default function RootLayout({
 			<body
 				className={`${ubuntuSans.variable} ${ubuntuMono.variable} antialiased`}
 			>
-				<AuthProvider>
-					{children}
-					<Toaster />
-				</AuthProvider>
+				<ThemeProvider
+					attribute="class"
+					defaultTheme="system"
+					enableSystem
+					disableTransitionOnChange
+				>
+					<AuthProvider>
+						{children}
+						<Toaster />
+					</AuthProvider>
+				</ThemeProvider>
 			</body>
 		</html>
 	);