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:
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: #7EE0A0;
|
||||
|
||||
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-arrivees__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: #216b3e;
|
||||
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-arrivees__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-arrivees__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-arrivees__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-arrivees__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-arrivees__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-arrivees__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-arrivees__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-arrivees__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-arrivees__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-arrivees__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-arrivees__status-label {
|
||||
font-size: 2.2vh;
|
||||
font-size: 24px;
|
||||
color: var(--yellow);
|
||||
font-weight: 500;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.aff-classiques-arrivees__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-arrivees__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-arrivees__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,13 +277,13 @@
|
||||
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;
|
||||
}
|
||||
|
||||
/* ══════════════════════════════════════════════════════════════════
|
||||
COL 4 — Destination + Info cause (flex:1 — prend tout le reste)
|
||||
COL 4 — Origine + Info cause (flex:1 — prend tout le reste)
|
||||
══════════════════════════════════════════════════════════════════ */
|
||||
.aff-classiques-arrivees__col-origin {
|
||||
flex: 1 1 0;
|
||||
@@ -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-arrivees__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-arrivees__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-arrivees__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-arrivees__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-arrivees__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-arrivees__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-arrivees__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-arrivees__clock-main {
|
||||
color: var(--text-white);
|
||||
font-weight: 800;
|
||||
font-size: 4.4vh;
|
||||
font-size: 48px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.aff-classiques-arrivees__clock-seconds {
|
||||
color: var(--yellow);
|
||||
font-weight: 800;
|
||||
font-size: 2.7vh;
|
||||
font-size: 29px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
|
||||
Reference in new issue
Block a user