julienfroidefond/towercontrol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: refactor theme management and enhance color customization

Browse Source 
- Cleaned up theme architecture by consolidating CSS variables and removing redundant theme applications, ensuring a single source of truth for theming.
- Implemented a dark mode override and improved color management using CSS variables for better customization.
- Updated various components to utilize new color variables, enhancing maintainability and visual consistency across the application.
- Added detailed tasks in TODO.md for future enhancements related to user preferences and color customization features.
This commit is contained in:
Julien Froidefond
2025-09-28 10:14:25 +02:00
parent 97770917c1
commit b5d6967fcd
21 changed files with 404 additions and 187 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/deadline/CriticalDeadlinesCard.tsx
View File

@@ -27,7 +27,7 @@ export function CriticalDeadlinesCard({ overdue, critical, warning }: CriticalDe
return {
icon: '🔴',
text: task.daysRemaining === -1 ? 'En retard de 1 jour' : `En retard de ${Math.abs(task.daysRemaining)} jours`,
style: 'text-red-700 bg-red-50/40 border-red-200/60 dark:bg-red-950/20 dark:border-red-800/40 dark:text-red-300'
style: 'border-[var(--destructive)]/60'
};
} else if (task.urgencyLevel === 'critical') {
return {
@@ -35,13 +35,13 @@ export function CriticalDeadlinesCard({ overdue, critical, warning }: CriticalDe
text: task.daysRemaining === 0 ? 'Échéance aujourd\'hui' :
task.daysRemaining === 1 ? 'Échéance demain' :
`Dans ${task.daysRemaining} jours`,
style: 'text-orange-700 bg-orange-50/40 border-orange-200/60 dark:bg-orange-950/20 dark:border-orange-800/40 dark:text-orange-300'
style: 'border-[var(--accent)]/60'
};
} else {
return {
icon: '🟡',
text: `Dans ${task.daysRemaining} jours`,
style: 'text-yellow-700 bg-yellow-50/40 border-yellow-200/60 dark:bg-yellow-950/20 dark:border-yellow-800/40 dark:text-yellow-300'
style: 'border-[var(--yellow)]/60'
};
}
};
@@ -71,7 +71,7 @@ export function CriticalDeadlinesCard({ overdue, critical, warning }: CriticalDe
<h3 className="text-lg font-semibold mb-4">Tâches Urgentes</h3>
<div className="text-center py-8">
<div className="text-4xl mb-2">🎉</div>
<h4 className="text-lg font-medium text-green-600 dark:text-green-400 mb-2">Excellent !</h4>
<h4 className="text-lg font-medium mb-2" style={{ color: 'var(--green)' }}>Excellent !</h4>
<p className="text-sm text-[var(--muted-foreground)]">
Aucune tâche urgente ou critique
</p>
@@ -89,7 +89,7 @@ export function CriticalDeadlinesCard({ overdue, critical, warning }: CriticalDe
</div>
</div>
<div className="space-y-2 max-h-40 overflow-y-auto scrollbar-thin scrollbar-thumb-gray-300 dark:scrollbar-thumb-gray-600 scrollbar-track-transparent pr-2">
<div className="space-y-2 max-h-40 overflow-y-auto scrollbar-thin scrollbar-track-transparent pr-2" style={{ scrollbarColor: 'var(--muted) transparent' }}>
{urgentTasks.map((task) => {
const urgencyStyle = getUrgencyStyle(task);
@@ -157,17 +157,17 @@ export function CriticalDeadlinesCard({ overdue, critical, warning }: CriticalDe
<div className="pt-3 border-t border-[var(--border)] mt-4">
<div className="flex flex-wrap gap-3 text-xs text-[var(--muted-foreground)] justify-center">
{overdue.length > 0 && (
<span className="text-red-600/80 dark:text-red-400/80 font-medium">
<span className="font-medium" style={{ color: 'var(--destructive)' }}>
{overdue.length} en retard
</span>
)}
{critical.length > 0 && (
<span className="text-orange-600/80 dark:text-orange-400/80 font-medium">
<span className="font-medium" style={{ color: 'var(--accent)' }}>
{critical.length} critique{critical.length > 1 ? 's' : ''}
</span>
)}
{warning.length > 0 && (
<span className="text-yellow-600/80 dark:text-yellow-400/80 font-medium">
<span className="font-medium" style={{ color: 'var(--yellow)' }}>
{warning.length} attention
</span>
)}