feat: Implement dark mode support across components and UI elements
- Added dark mode styles to TaskStatusDropdown, TaskStatusDropdownDebug, and TaskStatusDropdownSimple components. - Introduced ThemeProvider and useTheme hook for managing theme state. - Updated Button, Card, Input, Loading, Navigation, PageContainer, PageHeader, ProjectCalendarWidget, ProjectMap, SearchBar, States, Tooltip, and other UI components to support dark mode. - Created ThemeToggle component for switching between light and dark modes. - Enhanced i18n translations for settings related to theme and language preferences. - Configured Tailwind CSS to support dark mode with class-based toggling.
This commit is contained in:
@@ -3,6 +3,7 @@ import "./globals.css";
|
||||
import Navigation from "@/components/ui/Navigation";
|
||||
import { AuthProvider } from "@/components/auth/AuthProvider";
|
||||
import { TranslationProvider } from "@/lib/i18n";
|
||||
import { ThemeProvider } from "@/components/ThemeProvider";
|
||||
|
||||
const geistSans = Geist({
|
||||
variable: "--font-geist-sans",
|
||||
@@ -23,14 +24,16 @@ export default function RootLayout({ children }) {
|
||||
return (
|
||||
<html lang="pl">
|
||||
<body
|
||||
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
|
||||
className={`${geistSans.variable} ${geistMono.variable} antialiased bg-background text-foreground`}
|
||||
>
|
||||
<TranslationProvider initialLanguage="pl">
|
||||
<AuthProvider>
|
||||
<Navigation />
|
||||
<main>{children}</main>
|
||||
</AuthProvider>
|
||||
</TranslationProvider>
|
||||
<ThemeProvider>
|
||||
<TranslationProvider initialLanguage="pl">
|
||||
<AuthProvider>
|
||||
<Navigation />
|
||||
<main>{children}</main>
|
||||
</AuthProvider>
|
||||
</TranslationProvider>
|
||||
</ThemeProvider>
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user