From e351398fe643ca368f1edd3d8a89c34ec2dd5eeb Mon Sep 17 00:00:00 2001 From: mathis Date: Mon, 31 Aug 2026 00:04:48 +0200 Subject: [PATCH] fix(classiques): align text styles, weights, and box shapes to strictly match SNCF display img 1 --- .../classiques/ClassiquesArrivees.css | 36 +++++++++++-------- .../classiques/ClassiquesDeparts.css | 36 +++++++++++-------- 2 files changed, 42 insertions(+), 30 deletions(-) diff --git a/src/pages/afficheurs/classiques/ClassiquesArrivees.css b/src/pages/afficheurs/classiques/ClassiquesArrivees.css index f54628e..6ac246d 100644 --- a/src/pages/afficheurs/classiques/ClassiquesArrivees.css +++ b/src/pages/afficheurs/classiques/ClassiquesArrivees.css @@ -162,7 +162,7 @@ .aff-classiques-arrivees__stop-bullet { color: var(--yellow); - font-size: 54px; + font-size: 42px; margin-right: 14px; margin-left: 18px; line-height: 1; @@ -175,11 +175,11 @@ .aff-classiques-arrivees__stop-name { color: #d0d8e2; - font-size: 66px; - font-weight: 700; + font-size: 58px; + font-weight: 400; line-height: 1; font-family: "Achemine", sans-serif; - letter-spacing: -0.5px; + letter-spacing: -0.3px; } /* Colonne 1 : Logo opérateur (blanc) */ @@ -223,6 +223,7 @@ line-height: 1.1; text-transform: uppercase; white-space: nowrap; + font-family: "Achemine", sans-serif; } .aff-classiques-arrivees__train-number { @@ -232,15 +233,17 @@ line-height: 1.1; margin-top: 4px; white-space: nowrap; + font-family: "Achemine", sans-serif; } .aff-classiques-arrivees__status-ontime { color: var(--white); font-size: 28px; - font-weight: 700; + font-weight: 400; line-height: 1.1; white-space: nowrap; text-transform: lowercase; + font-family: "Achemine", sans-serif; } .aff-classiques-arrivees__status-delayed { @@ -249,6 +252,7 @@ font-weight: 700; line-height: 1.1; white-space: nowrap; + font-family: "Achemine", sans-serif; } .aff-classiques-arrivees__status-suppressed { @@ -258,12 +262,13 @@ line-height: 1.1; white-space: nowrap; text-transform: lowercase; + font-family: "Achemine", sans-serif; } /* Colonne 3 : Heure (Grande, jaune vif) */ .aff-classiques-arrivees__col-time { - width: 260px; - min-width: 260px; + width: 250px; + min-width: 250px; display: flex; align-items: center; justify-content: flex-start; @@ -276,7 +281,7 @@ .aff-classiques-arrivees__time { color: var(--yellow); - font-size: 74px; + font-size: 72px; font-weight: 700; line-height: 1; letter-spacing: -0.5px; @@ -302,13 +307,14 @@ .aff-classiques-arrivees__destination { color: var(--white); - font-size: 68px; - font-weight: 700; + font-size: 64px; + font-weight: 400; line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: "Achemine", sans-serif; + letter-spacing: -0.2px; } /* Colonne 5 : Quai / Voie (Premier plan absolu z-index: 20, au-dessus du watermark) */ @@ -325,10 +331,10 @@ } .aff-classiques-arrivees__platform-box { - width: 90px; - height: 86px; - border: 3.5px solid var(--white); - border-radius: 12px; + width: 82px; + height: 80px; + border: 2.5px solid var(--white); + border-radius: 6px; display: flex; align-items: center; justify-content: center; @@ -338,7 +344,7 @@ .aff-classiques-arrivees__platform-text { color: var(--white); - font-size: 62px; + font-size: 56px; font-weight: 700; line-height: 1; font-family: "Achemine", sans-serif; diff --git a/src/pages/afficheurs/classiques/ClassiquesDeparts.css b/src/pages/afficheurs/classiques/ClassiquesDeparts.css index 24d421b..9cd59cb 100644 --- a/src/pages/afficheurs/classiques/ClassiquesDeparts.css +++ b/src/pages/afficheurs/classiques/ClassiquesDeparts.css @@ -162,7 +162,7 @@ .aff-classiques-departs__stop-bullet { color: var(--yellow); - font-size: 54px; + font-size: 42px; margin-right: 14px; margin-left: 18px; line-height: 1; @@ -175,11 +175,11 @@ .aff-classiques-departs__stop-name { color: #d0d8e2; - font-size: 66px; - font-weight: 700; + font-size: 58px; + font-weight: 400; line-height: 1; font-family: "Achemine", sans-serif; - letter-spacing: -0.5px; + letter-spacing: -0.3px; } /* Colonne 1 : Logo opérateur (blanc) */ @@ -223,6 +223,7 @@ line-height: 1.1; text-transform: uppercase; white-space: nowrap; + font-family: "Achemine", sans-serif; } .aff-classiques-departs__train-number { @@ -232,15 +233,17 @@ line-height: 1.1; margin-top: 4px; white-space: nowrap; + font-family: "Achemine", sans-serif; } .aff-classiques-departs__status-ontime { color: var(--white); font-size: 28px; - font-weight: 700; + font-weight: 400; line-height: 1.1; white-space: nowrap; text-transform: lowercase; + font-family: "Achemine", sans-serif; } .aff-classiques-departs__status-delayed { @@ -249,6 +252,7 @@ font-weight: 700; line-height: 1.1; white-space: nowrap; + font-family: "Achemine", sans-serif; } .aff-classiques-departs__status-suppressed { @@ -258,12 +262,13 @@ line-height: 1.1; white-space: nowrap; text-transform: lowercase; + font-family: "Achemine", sans-serif; } /* Colonne 3 : Heure (Grande, jaune vif) */ .aff-classiques-departs__col-time { - width: 260px; - min-width: 260px; + width: 250px; + min-width: 250px; display: flex; align-items: center; justify-content: flex-start; @@ -276,7 +281,7 @@ .aff-classiques-departs__time { color: var(--yellow); - font-size: 74px; + font-size: 72px; font-weight: 700; line-height: 1; letter-spacing: -0.5px; @@ -302,13 +307,14 @@ .aff-classiques-departs__destination { color: var(--white); - font-size: 68px; - font-weight: 700; + font-size: 64px; + font-weight: 400; line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: "Achemine", sans-serif; + letter-spacing: -0.2px; } /* Colonne 5 : Quai / Voie (Premier plan absolu z-index: 20, au-dessus du watermark) */ @@ -325,10 +331,10 @@ } .aff-classiques-departs__platform-box { - width: 90px; - height: 86px; - border: 3.5px solid var(--white); - border-radius: 12px; + width: 82px; + height: 80px; + border: 2.5px solid var(--white); + border-radius: 6px; display: flex; align-items: center; justify-content: center; @@ -338,7 +344,7 @@ .aff-classiques-departs__platform-text { color: var(--white); - font-size: 62px; + font-size: 56px; font-weight: 700; line-height: 1; font-family: "Achemine", sans-serif;