RELEASE V4.1.0 : Voici les modifications apportées :

-> Refonte complète des afficheurs AFL départ et arrivée (+ Quais)
-> EVA DÉPARTS + ARRIVÉES

EN COURS DE DÉVELOPPEMENT :
-> REFONTE AFFICHEURS CLASSIQUES
-> IMPLÉMENTATION DONNÉES GTFS / GTFS-RT / SIRI LTE
This commit is contained in:
mathis committed 2026-08-29 18:24:44 +02:00
1 parent 6dfd798dd2
commit b1f180508e
23 files changed
+811 -686

No files matched your search

@@ -30,7 +30,7 @@
/* Info cause perturbation — slide-in de droite vers la gauche */
@keyframes infoWrapperGrow {
from { max-width: 0; }
to { max-width: 30vw; }
to { max-width: 576px; }
}
@keyframes infoSlideIn {
@@ -52,8 +52,8 @@
--text-muted: #7EB8E0;
position: relative;
width: 100vw;
height: 100vh;
width: 100%;
height: 100%;
overflow: hidden;
background: var(--blue-bg);
font-family: "Achemine", "Arial Narrow", Arial, sans-serif;
@@ -64,12 +64,12 @@
══════════════════════════════════════════════════════════════════ */
.aff-classiques-departs__watermark {
position: absolute;
right: -9vh;
right: -97px;
top: 50%;
transform: translateY(-50%) rotate(-90deg);
transform-origin: center;
/* Taille géante, très visible comme dans l'image */
font-size: 23vh;
font-size: 248px;
color: #1389D2;
font-weight: 900;
letter-spacing: 0.05em;
@@ -81,13 +81,13 @@
}
/* ══════════════════════════════════════════════════════════════════
LISTE STATIQUE — 10 lignes sur exactement 100vh
LISTE STATIQUE — 10 lignes sur exactement 1080px
══════════════════════════════════════════════════════════════════ */
.aff-classiques-departs__list {
list-style: none;
margin: 0;
padding: 0;
height: 100vh;
height: 1080px;
display: flex;
flex-direction: column;
position: relative;
@@ -98,7 +98,7 @@
MODE DÉFILEMENT — conteneur + track animé
══════════════════════════════════════════════════════════════════ */
.aff-classiques-departs__scroll-container {
height: 100vh;
height: 1080px;
overflow: hidden;
position: relative;
z-index: 2;
@@ -114,13 +114,13 @@
}
/* ══════════════════════════════════════════════════════════════════
ROW — chaque ligne occupe 1/10 de 100vh
ROW — chaque ligne occupe 1/10 de 1080px
══════════════════════════════════════════════════════════════════ */
.aff-classiques-departs__row {
display: flex;
align-items: center;
flex: 0 0 calc(100vh / 10);
height: calc(100vh / 10);
flex: 0 0 108px;
height: 108px;
min-height: 0;
padding: 0;
box-sizing: border-box;
@@ -136,7 +136,7 @@
justify-content: center;
align-items: center;
color: var(--text-white);
font-size: 3vh;
font-size: 32px;
text-align: center;
}
@@ -144,20 +144,20 @@
COL 1 — Logo opérateur (~9 % largeur)
══════════════════════════════════════════════════════════════════ */
.aff-classiques-departs__col-logo {
width: 9vw;
width: 173px;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
height: 100%;
padding: 0 0.4vw;
padding: 0 8px;
box-sizing: border-box;
}
.aff-classiques-departs__logo-box {
width: 100%;
/* Logo prend ~65% de la hauteur de la ligne */
height: 6vh;
height: 65px;
display: flex;
align-items: center;
justify-content: center;
@@ -172,7 +172,7 @@
.aff-classiques-departs__logo-text {
color: var(--text-white);
font-weight: 700;
font-size: 2vh;
font-size: 22px;
text-align: center;
word-break: break-word;
line-height: 1.1;
@@ -183,23 +183,23 @@
Alterne toutes les 4 secondes
══════════════════════════════════════════════════════════════════ */
.aff-classiques-departs__col-meta {
width: 11vw;
width: 211px;
flex-shrink: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100%;
padding: 0 0.5vw 0 0;
padding: 0 10px 0 0;
box-sizing: border-box;
gap: 0.05vh;
gap: 1px;
overflow: hidden;
text-align: center;
}
/* Vue normale — type (ex: "MOBIGO") */
.aff-classiques-departs__train-type {
font-size: 2.2vh;
font-size: 24px;
color: var(--text-white);
font-weight: 600;
line-height: 1.3;
@@ -211,7 +211,7 @@
/* Vue normale — numéro de sillon (ex: "894251") */
.aff-classiques-departs__train-number {
font-size: 2.2vh;
font-size: 24px;
color: var(--text-white);
font-weight: 400;
line-height: 1.3;
@@ -220,7 +220,7 @@
/* Vue statut — à l'heure */
.aff-classiques-departs__status-ontime {
font-size: 2.2vh;
font-size: 24px;
color: var(--text-white);
font-weight: 400;
line-height: 1.3;
@@ -236,14 +236,14 @@
}
.aff-classiques-departs__status-label {
font-size: 2.2vh;
font-size: 24px;
color: var(--yellow);
font-weight: 500;
white-space: nowrap;
}
.aff-classiques-departs__status-value {
font-size: 2.2vh;
font-size: 24px;
color: var(--yellow);
font-weight: 700;
white-space: nowrap;
@@ -251,7 +251,7 @@
/* Vue statut — supprimé */
.aff-classiques-departs__status-suppressed {
font-size: 2.2vh;
font-size: 24px;
color: var(--yellow);
font-weight: 700;
white-space: nowrap;
@@ -262,13 +262,13 @@
Grande, jaune vif (#FFCC00), bold — comme dans l'image
══════════════════════════════════════════════════════════════════ */
.aff-classiques-departs__col-time {
width: 15vw;
width: 288px;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: flex-start;
height: 100%;
padding: 0 0.3vw 0 0;
padding: 0 6px 0 0;
box-sizing: border-box;
}
@@ -277,7 +277,7 @@
color: var(--yellow);
font-weight: 700;
/* Grande taille — occupe ~65% de la hauteur de ligne */
font-size: 6.5vh;
font-size: 70px;
line-height: 1;
white-space: nowrap;
}
@@ -292,14 +292,14 @@
align-items: center;
overflow: hidden;
height: 100%;
padding-right: 0.5vw;
padding-right: 10px;
}
/* Texte destination — blanc, bold, très grand */
.aff-classiques-departs__destination {
color: var(--text-white);
font-weight: 700;
font-size: 6.5vh;
font-size: 70px;
line-height: 1;
white-space: nowrap;
overflow: hidden;
@@ -326,41 +326,41 @@
.aff-classiques-departs__separator {
color: var(--text-white);
font-size: 4.5vh;
font-size: 49px;
font-weight: 200;
line-height: 1;
flex-shrink: 0;
padding: 0 0.9vw;
padding: 0 17px;
}
.aff-classiques-departs__info-text {
color: var(--text-white);
font-size: 1.9vh;
font-size: 21px;
font-weight: 400;
white-space: normal;
overflow: hidden;
line-height: 1.25;
max-width: 22vw;
max-width: 422px;
}
/* ══════════════════════════════════════════════════════════════════
COL 5 — Quai OU icône bus (~6.5 % largeur)
══════════════════════════════════════════════════════════════════ */
.aff-classiques-departs__col-platform {
width: 6.5vw;
width: 125px;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
height: 100%;
box-sizing: border-box;
padding: 0.5vh 0.4vw;
padding: 5px 8px;
}
/* Boîte quai — bordure blanche */
.aff-classiques-departs__platform-box {
width: 6vh;
height: 6vh;
width: 65px;
height: 65px;
border: 2.5px solid rgba(255, 255, 255, 0.88);
display: flex;
align-items: center;
@@ -373,7 +373,7 @@
.aff-classiques-departs__platform-text {
color: var(--text-white);
font-weight: 700;
font-size: 4.5vh;
font-size: 49px;
line-height: 1;
}
@@ -382,8 +382,8 @@
══════════════════════════════════════════════════════════════════ */
.aff-classiques-departs__footer {
position: absolute;
right: 1.2vw;
bottom: 0.8vh;
right: 23px;
bottom: 9px;
z-index: 30;
pointer-events: none;
}
@@ -397,24 +397,24 @@
border: 2.5px solid rgba(255, 255, 255, 0.88);
background: rgba(0, 51, 102, 0.93);
border-radius: 8px;
padding: 0.4vh 1.1vw;
padding: 4px 21px;
display: flex;
align-items: baseline;
gap: 0.5vw;
gap: 10px;
box-shadow: 0 2px 16px rgba(0, 0, 0, 0.65);
}
.aff-classiques-departs__clock-main {
color: var(--text-white);
font-weight: 800;
font-size: 4.4vh;
font-size: 48px;
line-height: 1;
}
.aff-classiques-departs__clock-seconds {
color: var(--yellow);
font-weight: 800;
font-size: 2.7vh;
font-size: 29px;
line-height: 1;
}