feat: add theme system with light/dark mode support

- Add ThemeStore (Zustand) for reactive theme switching
- Add Themes.tsx with THEMES object (defaultLight, defaultDark)
- Add Settings screen with theme switcher and logout button
- Add BaseButton component for reusable themed buttons
- Migrate all components from static currentTheme to useThemeStore()
- Add shadowColor to theme (iOS only, Android uses elevation)
- All text elements now use theme colors (textPrimary, textSecondary, etc.)
- Update tab navigation to include Settings tab
- Move logout from Header to Settings screen
This commit is contained in:
2026-01-24 16:57:33 +01:00
parent 1dbca79edd
commit 43d40b46d7
23 changed files with 450 additions and 236 deletions

View File

@@ -0,0 +1,12 @@
import { create } from "zustand";
import { Theme, THEMES } from "../Themes";
interface ThemeState {
theme: Theme;
setTheme: (themeName: keyof typeof THEMES) => void;
}
export const useThemeStore = create<ThemeState>((set) => ({
theme: THEMES.defaultLight,
setTheme: (themeName) => set({theme: THEMES[themeName]})
}))