From 11ffb77005c88cca97ce1d4faa95f93edccd493a Mon Sep 17 00:00:00 2001
From: Manus <dev-agent@manus.ai>
Date: Fri, 17 Apr 2026 11:25:13 -0400
Subject: [PATCH] =?UTF-8?q?Checkpoint:=20Vue=20liste=20Solutions=20Logicie?=
 =?UTF-8?q?lles=20:=20alternance=20de=20deux=20couleurs=20de=20fond=20(bla?=
 =?UTF-8?q?nc=20pour=20les=20solutions=20paires,=20bleu=20tr=C3=A8s=20clai?=
 =?UTF-8?q?r=20pour=20les=20solutions=20impaires)=20=C3=A0=20chaque=20chan?=
 =?UTF-8?q?gement=20de=20solution.=20Les=20lignes=20rowSpan=20partagent=20?=
 =?UTF-8?q?la=20m=C3=AAme=20couleur=20de=20fond=20que=20leur=20groupe.=20E?=
 =?UTF-8?q?ffet=20hover=20doux=20sur=20chaque=20ligne.=200=20erreur=20Type?=
 =?UTF-8?q?Script.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/SolutionsLogicielles.tsx | 19 ++++++++++++-------
 todo.md                                   |  4 ++++
 2 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/client/src/pages/SolutionsLogicielles.tsx b/client/src/pages/SolutionsLogicielles.tsx
index e13adda..7c3f81f 100644
--- a/client/src/pages/SolutionsLogicielles.tsx
+++ b/client/src/pages/SolutionsLogicielles.tsx
@@ -277,10 +277,15 @@ export default function SolutionsLogicielles() {
                 </tr>
               </thead>
               <tbody>
-                {filtered.map((sol) => {
+                {filtered.map((sol, solIdx) => {
+                  // Couleurs alternées : pair = blanc/gris très clair, impair = bleu très clair
+                  const isEven = solIdx % 2 === 0;
+                  const rowBg = isEven ? "bg-white hover:bg-blue-50/40" : "bg-blue-50/60 hover:bg-blue-100/50";
+                  const rowBgSpan = isEven ? "bg-white" : "bg-blue-50/60";
+
                   if (sol.etablissements.length === 0) {
                     return (
-                      <tr key={`sol-${sol.solutionId}-empty`} className="border-b border-border last:border-0 hover:bg-muted/20 transition-colors">
+                      <tr key={`sol-${sol.solutionId}-empty`} className={`border-b border-border last:border-0 transition-colors ${rowBg}`}>
                         <td className="px-4 py-3 font-medium text-foreground">{sol.solutionNom}</td>
                         <td className="px-4 py-3 text-muted-foreground">{sol.editeurNom}</td>
                         <td className="px-4 py-3 hidden sm:table-cell">
@@ -302,17 +307,17 @@ export default function SolutionsLogicielles() {
                     );
                   }
                   return sol.etablissements.map((etab, idx) => (
-                    <tr key={`sol-${sol.solutionId}-etab-${etab.id}`} className="border-b border-border last:border-0 hover:bg-muted/20 transition-colors">
+                    <tr key={`sol-${sol.solutionId}-etab-${etab.id}`} className={`border-b border-border last:border-0 transition-colors ${idx === 0 ? rowBg : rowBgSpan + " hover:brightness-95"}`}>
                       {idx === 0 ? (
                         <>
-                          <td className="px-4 py-3 font-semibold text-foreground align-top" rowSpan={sol.etablissements.length}>
+                          <td className={`px-4 py-3 font-semibold text-foreground align-top ${rowBgSpan}`} rowSpan={sol.etablissements.length}>
                             <div className="flex items-center gap-2">
                               <Package size={13} className="text-blue-500 flex-shrink-0" />
                               {sol.solutionNom}
                             </div>
                           </td>
-                          <td className="px-4 py-3 text-muted-foreground align-top" rowSpan={sol.etablissements.length}>{sol.editeurNom}</td>
-                          <td className="px-4 py-3 hidden sm:table-cell align-top" rowSpan={sol.etablissements.length}>
+                          <td className={`px-4 py-3 text-muted-foreground align-top ${rowBgSpan}`} rowSpan={sol.etablissements.length}>{sol.editeurNom}</td>
+                          <td className={`px-4 py-3 hidden sm:table-cell align-top ${rowBgSpan}`} rowSpan={sol.etablissements.length}>
                             {sol.blocFonctionnelNom && (
                               <span className="text-xs bg-secondary text-secondary-foreground px-2 py-0.5 rounded-full border border-border">{sol.blocFonctionnelNom}</span>
                             )}
@@ -328,7 +333,7 @@ export default function SolutionsLogicielles() {
                       <td className="px-4 py-3 text-muted-foreground hidden md:table-cell">{etab.region ?? "—"}</td>
                       <td className="px-4 py-3"><EtatBadge etat={etab.etatDeploiement} /></td>
                       {isGestionnaire && idx === 0 ? (
-                        <td className="px-4 py-3 align-top" rowSpan={sol.etablissements.length}>
+                        <td className={`px-4 py-3 align-top ${rowBgSpan}`} rowSpan={sol.etablissements.length}>
                           <div className="flex items-center gap-1">
                             <button onClick={() => openEdit(sol)} className="p-1.5 rounded bg-blue-50 text-blue-600 hover:bg-blue-100 transition-colors" title="Modifier"><Pencil size={12} /></button>
                             <button onClick={() => { if (confirm(`Supprimer "${sol.solutionNom}" ?`)) deleteMutation.mutate({ id: sol.solutionId }); }} className="p-1.5 rounded bg-red-50 text-red-600 hover:bg-red-100 transition-colors" title="Supprimer"><Trash2 size={12} /></button>
diff --git a/todo.md b/todo.md
index f5d40d9..8729d88 100644
--- a/todo.md
+++ b/todo.md
@@ -84,3 +84,7 @@
 - [x] Backend : procédure statistiques (stats par bloc fonctionnel, par région, taux de remplissage)
 - [x] Page "Tableau de bord" : graphiques recharts (barres, camembert, indicateurs clés)
 - [x] Lien "Tableau de bord" dans la sidebar (visible uniquement gestionnaires)
+
+## Évolution v7
+
+- [x] Vue liste Solutions Logicielles : alternance de couleurs de fond (blanc / bleu clair) à chaque changement de solution pour améliorer la lisibilité