Checkpoint: Amélioration visuelle de la gestion des séquences : le taux de remplissage (pourcentage) s'affiche maintenant en couleur conditionnelle (vert pour <70%, orange pour 70-90%, rouge pour >90%) pour faciliter l'identification rapide des séquences proches de la capacité maximale. L'icône corbeille de suppression est maintenant affichée en rouge pour mieux signaler l'action destructive.

client/src/components/CapacityProgressBar.tsx

@@ -19,13 +19,20 @@ export default function CapacityProgressBar({
     return "bg-red-500";
   };
 
+  // Déterminer la couleur du texte selon le taux de remplissage
+  const getTextColor = () => {
+    if (percentage < 70) return "text-green-600";
+    if (percentage < 90) return "text-orange-600";
+    return "text-red-600";
+  };
+
   return (
     <div className="space-y-2">
       <div className="flex items-center justify-between gap-4">
         <span className="text-sm font-medium whitespace-nowrap">
           {nbInscrits} / {capaciteMax}
         </span>
-        <span className="text-sm text-muted-foreground whitespace-nowrap">
+        <span className={cn("text-sm font-semibold whitespace-nowrap", getTextColor())}>
           {percentage}%
         </span>
       </div>

client/src/pages/AdminSequences.tsx

@@ -694,7 +694,7 @@ export default function AdminSequences() {
                               size="sm"
                               onClick={() => handleDelete(sequence.id)}
                             >
-                              <Trash2 className="h-4 w-4" />
+                              <Trash2 className="h-4 w-4 text-red-600" />
                             </Button>
                           </div>
                         </TableCell>

todo.md

@@ -540,3 +540,8 @@
 
 - [x] Ajouter le graphique de répartition par établissement sur le tableau de bord principal
 - [x] Placer le graphique à côté du graphique par fonction
+
+## Amélioration affichage gestion des séquences
+
+- [x] Afficher le taux de remplissage avec couleur conditionnelle (vert <70%, orange 70-90%, rouge >90%)
+- [x] Changer la couleur de l'icône corbeille en rouge