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:
12
apps/client/src/stores/ThemeStore.ts
Normal file
12
apps/client/src/stores/ThemeStore.ts
Normal 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]})
|
||||
}))
|
||||
Reference in New Issue
Block a user