Files
towercontrol/src/lib/theme-config.ts
Julien Froidefond 10c1f811ce feat: integrate ToastProvider and enhance theme management
- Added `ToastProvider` to `RootLayout` for improved user feedback on theme changes.
- Updated `ThemeProvider` to display toast notifications with theme names and icons upon theme changes.
- Refactored theme-related imports to streamline code and improve maintainability.
- Simplified background cycling logic in `useBackgroundCycle` to utilize centralized background definitions.
- Cleaned up unused background definitions in `BackgroundContext` for better clarity and performance.
2025-10-02 17:24:37 +02:00

77 lines
2.6 KiB
TypeScript

// Types de thèmes
export type Theme = 'light' | 'dark' | 'dracula' | 'monokai' | 'nord' | 'gruvbox' | 'tokyo_night' | 'catppuccin' | 'rose_pine' | 'one_dark' | 'material' | 'solarized';
// Configuration des thèmes
export const THEME_CONFIG = {
// Thème par défaut
default: 'dark' as Theme,
// Thème light
light: 'light' as Theme,
// Liste de tous les thèmes dark disponibles
darkThemes: [
'dark',
'dracula',
'monokai',
'nord',
'gruvbox',
'tokyo_night',
'catppuccin',
'rose_pine',
'one_dark',
'material',
'solarized'
] as Theme[],
// Tous les thèmes disponibles
allThemes: [
'light',
'dark',
'dracula',
'monokai',
'nord',
'gruvbox',
'tokyo_night',
'catppuccin',
'rose_pine',
'one_dark',
'material',
'solarized'
] as Theme[],
// Métadonnées des thèmes (déplacées vers ui-config.ts)
metadata: {
light: { name: 'Light', description: 'Thème clair par défaut', icon: '☀️' },
dark: { name: 'Dark', description: 'Thème sombre classique', icon: '🌙' },
dracula: { name: 'Dracula', description: 'Inspiré du thème Dracula', icon: '🧛' },
monokai: { name: 'Monokai', description: 'Inspiré du thème Monokai', icon: '🎨' },
nord: { name: 'Nord', description: 'Palette Nord arctique', icon: '❄️' },
gruvbox: { name: 'Gruvbox', description: 'Palette Gruvbox retro', icon: '🎭' },
tokyo_night: { name: 'Tokyo Night', description: 'Nuit tokyoïte', icon: '🌃' },
catppuccin: { name: 'Catppuccin', description: 'Palette pastel douce', icon: '🐱' },
rose_pine: { name: 'Rose Pine', description: 'Palette rose et pin', icon: '🌹' },
one_dark: { name: 'One Dark', description: 'Inspiré d\'Atom One Dark', icon: '🌑' },
material: { name: 'Material', description: 'Inspiré de Material Design', icon: '📱' },
solarized: { name: 'Solarized', description: 'Palette Solarized', icon: '☀️' }
}
} as const;
// Fonctions utilitaires
export const getNextDarkTheme = (currentTheme: Theme): Theme => {
const currentIndex = THEME_CONFIG.darkThemes.indexOf(currentTheme);
if (currentIndex === -1) {
return THEME_CONFIG.darkThemes[0];
}
const nextIndex = (currentIndex + 1) % THEME_CONFIG.darkThemes.length;
return THEME_CONFIG.darkThemes[nextIndex];
};
export const isDarkTheme = (theme: Theme): boolean => {
return THEME_CONFIG.darkThemes.includes(theme);
};
export const getThemeMetadata = (theme: Theme) => {
return THEME_CONFIG.metadata[theme] || { name: theme, description: 'Thème personnalisé', icon: '🎨' };
};