Checkpoint: Amélioration visuelle de la fenêtre des séquences : l'icône œil (visualisation) s'affiche maintenant en bleu pour mieux la distinguer. Chaque formation a une couleur unique (bleu, violet, rose, indigo, cyan, etc.) appliquée à son nom dans le tableau, facilitant l'identification visuelle rapide des séquences par formation sans utiliser vert, orange ou rouge déjà réservés aux indicateurs de capacité.

This commit is contained in:
Manus Sandbox
2025-11-23 17:12:59 -05:00
parent 41fc4874fd
commit d2bb185ea5
2 changed files with 24 additions and 2 deletions

View File

@@ -252,6 +252,23 @@ export default function AdminSequences() {
return formations?.find((f) => f.id === formationId)?.nom || "N/A"; return formations?.find((f) => f.id === formationId)?.nom || "N/A";
}; };
// Générer une couleur unique par formation (en évitant vert, orange, rouge)
const getFormationColor = (formationId: number) => {
const colors = [
"text-blue-600",
"text-purple-600",
"text-pink-600",
"text-indigo-600",
"text-cyan-600",
"text-teal-600",
"text-violet-600",
"text-fuchsia-600",
"text-sky-600",
"text-amber-600",
];
return colors[formationId % colors.length];
};
const formatDate = (dateValue: any) => { const formatDate = (dateValue: any) => {
if (!dateValue) return "N/A"; if (!dateValue) return "N/A";
@@ -643,7 +660,7 @@ export default function AdminSequences() {
<TableBody> <TableBody>
{filteredAndSortedSequences.map((sequence) => ( {filteredAndSortedSequences.map((sequence) => (
<TableRow key={sequence.id}> <TableRow key={sequence.id}>
<TableCell className="font-medium">{getFormationName(sequence.formationId)}</TableCell> <TableCell className={`font-semibold ${getFormationColor(sequence.formationId)}`}>{getFormationName(sequence.formationId)}</TableCell>
<TableCell>{sequence.nom}</TableCell> <TableCell>{sequence.nom}</TableCell>
<TableCell> <TableCell>
<div className="space-y-1 text-sm"> <div className="space-y-1 text-sm">
@@ -680,7 +697,7 @@ export default function AdminSequences() {
size="sm" size="sm"
onClick={() => setLocation(`/admin/sequences/${sequence.id}/inscrits`)} onClick={() => setLocation(`/admin/sequences/${sequence.id}/inscrits`)}
> >
<Eye className="h-4 w-4" /> <Eye className="h-4 w-4 text-blue-600" />
</Button> </Button>
<Button <Button
variant="ghost" variant="ghost"

View File

@@ -545,3 +545,8 @@
- [x] Afficher le taux de remplissage avec couleur conditionnelle (vert <70%, orange 70-90%, rouge >90%) - [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 - [x] Changer la couleur de l'icône corbeille en rouge
## Amélioration visuelle fenêtre des séquences
- [x] Changer la couleur de l'icône œil en bleu
- [x] Coloriser le texte des formations avec une couleur unique par formation (éviter vert, orange, rouge)