fix(classiques): pixel-perfect clock box from img 2, yellow bullet stops styling from img 1, and 1 train = 1 color stripe alternation

src/pages/afficheurs/classiques/ClassiquesArrivees.js

@@ -72,11 +72,11 @@ const formatPlatform = (p) => {
   return String(p).toUpperCase().replace(/VOIE|QUAI|\s+/gi, '').trim();
 };
 
-const formatStopsForArrivees = (horaire, currentStationName, normalizeFn) => {
+const getStopsListForArrivees = (horaire, currentStationName, normalizeFn) => {
   const stops = (horaire && (horaire.stops || horaire.gares_desservies)) || [];
   if (!Array.isArray(stops) || stops.length === 0) {
     const orig = formatStationName((horaire && (horaire.gare_depart_nom || horaire.gare_depart || horaire.origine)) || '');
-    return orig ? `• ${orig}` : '';
+    return orig ? [orig] : [];
   }
 
   const curNorm = normalizeFn ? normalizeFn(currentStationName || '') : String(currentStationName || '').toLowerCase().trim();
@@ -95,11 +95,10 @@ const formatStopsForArrivees = (horaire, currentStationName, normalizeFn) => {
   const precedingStops = stops.slice(0, endIdx);
   if (precedingStops.length === 0) {
     const orig = formatStationName((horaire && (horaire.gare_depart_nom || horaire.gare_depart || horaire.origine)) || '');
-    return orig ? `• ${orig}` : '';
+    return orig ? [orig] : [];
   }
 
-  const stopNames = precedingStops.map(s => formatStationName(s.nom || s.gare_nom || s.name || s.stop_name || '')).filter(Boolean);
-  return stopNames.map(n => `• ${n}`).join(' ');
+  return precedingStops.map(s => formatStationName(s.nom || s.gare_nom || s.name || s.stop_name || '')).filter(Boolean);
 };
 
 function BottomClock() {
@@ -115,9 +114,9 @@ function BottomClock() {
 
   return (
     <div className="aff-classiques-arrivees__bottom-clock" aria-hidden>
-      <span>{hh}</span>
-      <span>{mm}</span>
-      <span>{ss}</span>
+      <span className="aff-classiques-arrivees__bottom-clock-hm">{hh}</span>
+      <span className="aff-classiques-arrivees__bottom-clock-hm">{mm}</span>
+      <span className="aff-classiques-arrivees__bottom-clock-s">{ss}</span>
     </div>
   );
 }
@@ -1219,7 +1218,8 @@ export default function ClassiquesArrivees(){
 
   const renderRow = (h, idx) => {
     const isExtended = Boolean(h && h._isExtended);
-    const isOdd = ((h && typeof h._slotIndex === 'number' ? h._slotIndex : idx) % 2 === 0);
+    const trainIndex = (h && typeof h._trainIndex === 'number') ? h._trainIndex : idx;
+    const isOdd = (trainIndex % 2 === 0);
 
 	if (h && h._isEmpty) {
       if (isExtended) {
@@ -1261,7 +1261,7 @@ export default function ClassiquesArrivees(){
 	const isDelayed = status && status.label && String(status.label).startsWith('retardé');
 	const showPlatform = !isSuppressed && Boolean(cleanPlatform);
 
-    const stopsText = isExtended ? formatStopsForArrivees(horaire, gareDisplay || gareParam, normalizeName) : '';
+    const stopsList = isExtended ? getStopsListForArrivees(horaire, gareDisplay || gareParam, normalizeName) : [];
 
     if (isExtended) {
       return (
@@ -1309,10 +1309,22 @@ export default function ClassiquesArrivees(){
             </div>
           </div>
 
-          {/* Ligne basse (108px) : gares de provenance défilantes */}
+          {/* Ligne basse (108px) : gares de provenance défilantes avec puces jaunes */}
           <div className="aff-classiques-arrivees__extended-bottom">
             <div className="aff-classiques-arrivees__sub-stops">
-              <MarqueeText text={stopsText} className="aff-classiques-arrivees__sub-stops-text" />
+              <MarqueeText
+                className="aff-classiques-arrivees__sub-stops-marquee"
+                text={
+                  <span className="aff-classiques-arrivees__stops-chain">
+                    {stopsList.map((stopName, sIdx) => (
+                      <span key={sIdx} className="aff-classiques-arrivees__stop-item">
+                        <span className="aff-classiques-arrivees__stop-bullet">•</span>
+                        <span className="aff-classiques-arrivees__stop-name">{stopName}</span>
+                      </span>
+                    ))}
+                  </span>
+                }
+              />
             </div>
           </div>
         </li>
@@ -1385,7 +1397,7 @@ export default function ClassiquesArrivees(){
     displayRows.push({
       ...train,
       _isExtended: true,
-      _slotIndex: usedSlots
+      _trainIndex: trainIdx
     });
     usedSlots += 2;
     trainIdx++;
@@ -1396,7 +1408,7 @@ export default function ClassiquesArrivees(){
     displayRows.push({
       ...train,
       _isExtended: false,
-      _slotIndex: usedSlots
+      _trainIndex: trainIdx
     });
     usedSlots += 1;
     trainIdx++;