AdminGit
8f00da0896
-> Conversion du temps de retard pour >=60 Min -> Amélioration du rendu EVA (AFFICHEUR ABANDONNÉ PAR SNCF, Abandon possible) -> AFFICHAGE DE TOUTES LES DONNÉES EN MÊME TEMPS
439 lines
9.5 KiB
CSS
439 lines
9.5 KiB
CSS
/* ══════════════════════════════════════════════════════════════════
|
|
AFFICHEUR CLASSIQUES DÉPARTS (Image 1)
|
|
Résolution standard 1920x1080 - 10 Lignes (108px/ligne)
|
|
══════════════════════════════════════════════════════════════════ */
|
|
|
|
/* Conteneur 1920x1080 */
|
|
.aff-classiques-departs__container {
|
|
--blue-odd: #004b93;
|
|
--blue-even: #003066;
|
|
--yellow: #ffc700;
|
|
--white: #ffffff;
|
|
--sidebar-blue: #1084d7;
|
|
|
|
position: relative;
|
|
width: 1920px;
|
|
height: 1080px;
|
|
max-width: 1920px;
|
|
max-height: 1080px;
|
|
overflow: hidden;
|
|
background: var(--blue-even);
|
|
font-family: "Achemine", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
|
|
user-select: none;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* Watermark / Texte vertical "départs" sur la droite (Calque intermédiaire z-index: 10) */
|
|
.aff-classiques-departs__sidebar {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
width: 260px;
|
|
height: 1080px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
z-index: 10;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.aff-classiques-departs__sidebar-text {
|
|
color: var(--sidebar-blue);
|
|
font-size: 210px;
|
|
font-weight: 700;
|
|
letter-spacing: -2px;
|
|
line-height: 1;
|
|
transform: rotate(90deg);
|
|
transform-origin: center center;
|
|
white-space: nowrap;
|
|
font-family: "Achemine", sans-serif;
|
|
user-select: none;
|
|
}
|
|
|
|
/* Liste des 10 lignes (Calque de fond z-index: 1) */
|
|
.aff-classiques-departs__list {
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
width: 100%;
|
|
height: 1080px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
position: relative;
|
|
}
|
|
|
|
/* Chaque ligne simple (108px de haut) */
|
|
.aff-classiques-departs__row {
|
|
display: flex;
|
|
align-items: center;
|
|
height: 108px;
|
|
min-height: 108px;
|
|
max-height: 108px;
|
|
box-sizing: border-box;
|
|
padding-left: 20px;
|
|
padding-right: 8px;
|
|
position: relative;
|
|
}
|
|
|
|
.aff-classiques-departs__row--odd,
|
|
.aff-classiques-departs__row:nth-child(odd) {
|
|
background: var(--blue-odd);
|
|
}
|
|
|
|
.aff-classiques-departs__row--even,
|
|
.aff-classiques-departs__row:nth-child(even) {
|
|
background: var(--blue-even);
|
|
}
|
|
|
|
.aff-classiques-departs__row--empty {
|
|
opacity: 0.9;
|
|
}
|
|
|
|
/* ── LIGNE ÉTENDUE (216px = 2 lignes réduites) ── */
|
|
.aff-classiques-departs__row--extended {
|
|
height: 216px;
|
|
min-height: 216px;
|
|
max-height: 216px;
|
|
padding: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.aff-classiques-departs__row--extended.aff-classiques-departs__row--odd {
|
|
background: var(--blue-odd) !important;
|
|
}
|
|
|
|
.aff-classiques-departs__row--extended.aff-classiques-departs__row--even {
|
|
background: var(--blue-even) !important;
|
|
}
|
|
|
|
.aff-classiques-departs__extended-top {
|
|
height: 108px;
|
|
min-height: 108px;
|
|
max-height: 108px;
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
box-sizing: border-box;
|
|
padding-left: 20px;
|
|
padding-right: 8px;
|
|
background: transparent;
|
|
}
|
|
|
|
.aff-classiques-departs__extended-bottom {
|
|
height: 108px;
|
|
min-height: 108px;
|
|
max-height: 108px;
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
box-sizing: border-box;
|
|
padding-left: 290px;
|
|
padding-right: 240px;
|
|
background: transparent;
|
|
}
|
|
|
|
.aff-classiques-departs__sub-stops {
|
|
flex: 1 1 0;
|
|
min-width: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
overflow: hidden;
|
|
position: relative;
|
|
z-index: 2;
|
|
}
|
|
|
|
.aff-classiques-departs__sub-stops-marquee {
|
|
width: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.aff-classiques-departs__stops-chain {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.aff-classiques-departs__stop-item {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.aff-classiques-departs__stop-bullet {
|
|
color: var(--yellow);
|
|
font-size: 46px;
|
|
margin-right: 14px;
|
|
margin-left: 18px;
|
|
line-height: 1;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.aff-classiques-departs__stop-item:first-child .aff-classiques-departs__stop-bullet {
|
|
margin-left: 0;
|
|
}
|
|
|
|
.aff-classiques-departs__stop-name {
|
|
color: #d0d8e2;
|
|
font-size: 62px;
|
|
font-weight: 600;
|
|
line-height: 1;
|
|
font-family: "Achemine", sans-serif;
|
|
letter-spacing: -0.3px;
|
|
}
|
|
|
|
/* Colonne 1 : Logo opérateur (blanc) */
|
|
.aff-classiques-departs__col-logo {
|
|
width: 105px;
|
|
min-width: 105px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 100%;
|
|
position: relative;
|
|
z-index: 2;
|
|
}
|
|
|
|
.aff-classiques-departs__op-logo {
|
|
max-width: 88px;
|
|
max-height: 52px;
|
|
object-fit: contain;
|
|
filter: brightness(0) invert(1);
|
|
}
|
|
|
|
/* Colonne 2 : Type de train + Numéro OU Statut */
|
|
.aff-classiques-departs__col-meta {
|
|
width: 200px;
|
|
min-width: 200px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: flex-start;
|
|
padding-left: 12px;
|
|
height: 100%;
|
|
box-sizing: border-box;
|
|
position: relative;
|
|
z-index: 2;
|
|
}
|
|
|
|
.aff-classiques-departs__train-type {
|
|
font-size: 28px;
|
|
font-weight: 700;
|
|
color: var(--white);
|
|
line-height: 1.1;
|
|
text-transform: uppercase;
|
|
white-space: nowrap;
|
|
font-family: "Achemine", sans-serif;
|
|
}
|
|
|
|
.aff-classiques-departs__train-number {
|
|
font-size: 28px;
|
|
font-weight: 700;
|
|
color: var(--white);
|
|
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: 32px;
|
|
font-weight: 700;
|
|
line-height: 1.1;
|
|
white-space: nowrap;
|
|
text-transform: lowercase;
|
|
font-family: "Achemine", sans-serif;
|
|
}
|
|
|
|
.aff-classiques-departs__status-delayed {
|
|
color: var(--yellow);
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: flex-start;
|
|
font-family: "Achemine", sans-serif;
|
|
line-height: 1.05;
|
|
}
|
|
|
|
.aff-classiques-departs__status-delayed-label {
|
|
font-size: 24px;
|
|
font-weight: 700;
|
|
color: var(--yellow);
|
|
text-transform: lowercase;
|
|
}
|
|
|
|
.aff-classiques-departs__status-delayed-time {
|
|
font-size: 26px;
|
|
font-weight: 700;
|
|
color: var(--yellow);
|
|
}
|
|
|
|
.aff-classiques-departs__status-suppressed {
|
|
color: #ff4d4d;
|
|
font-size: 32px;
|
|
font-weight: 700;
|
|
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;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-start;
|
|
padding-left: 14px;
|
|
height: 100%;
|
|
box-sizing: border-box;
|
|
position: relative;
|
|
z-index: 2;
|
|
}
|
|
|
|
.aff-classiques-departs__time {
|
|
color: var(--yellow);
|
|
font-size: 76px;
|
|
font-weight: 700;
|
|
line-height: 1;
|
|
letter-spacing: -0.5px;
|
|
white-space: nowrap;
|
|
font-family: "Achemine", sans-serif;
|
|
}
|
|
|
|
/* Colonne 4 : Destination */
|
|
.aff-classiques-departs__col-destination {
|
|
flex: 1 1 0;
|
|
min-width: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-start;
|
|
padding-left: 10px;
|
|
padding-right: 20px;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
box-sizing: border-box;
|
|
position: relative;
|
|
z-index: 2;
|
|
}
|
|
|
|
.aff-classiques-departs__destination {
|
|
color: var(--white);
|
|
font-size: 70px;
|
|
font-weight: 700;
|
|
line-height: 1;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
font-family: "Achemine", sans-serif;
|
|
letter-spacing: -0.4px;
|
|
}
|
|
|
|
/* Colonne 5 : Quai / Voie (Premier plan absolu z-index: 20, au-dessus du watermark) */
|
|
.aff-classiques-departs__col-platform {
|
|
width: 96px;
|
|
min-width: 96px;
|
|
flex-shrink: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 100%;
|
|
position: relative;
|
|
z-index: 20;
|
|
margin-right: 6px;
|
|
}
|
|
|
|
.aff-classiques-departs__platform-box {
|
|
width: 86px;
|
|
height: 86px;
|
|
border: 3px solid var(--white);
|
|
border-radius: 8px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: transparent;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.aff-classiques-departs__platform-text {
|
|
color: var(--white);
|
|
font-size: 60px;
|
|
font-weight: 700;
|
|
line-height: 1;
|
|
font-family: "Achemine", sans-serif;
|
|
text-align: center;
|
|
}
|
|
|
|
/* ── 10e LIGNE : BANDEAU D'INFORMATION & HORLOGE (time=true) ── */
|
|
.aff-classiques-departs__row--info-bottom {
|
|
height: 108px;
|
|
min-height: 108px;
|
|
max-height: 108px;
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
box-sizing: border-box;
|
|
padding-left: 24px;
|
|
padding-right: 14px;
|
|
background: linear-gradient(180deg, #093c83 0%, #001f55 100%) !important;
|
|
position: relative;
|
|
z-index: 25;
|
|
border-top: 1.5px solid rgba(255, 255, 255, 0.18);
|
|
}
|
|
|
|
.aff-classiques-departs__info-bar {
|
|
flex: 1 1 0;
|
|
min-width: 0;
|
|
overflow: hidden;
|
|
display: flex;
|
|
align-items: center;
|
|
margin-right: 20px;
|
|
}
|
|
|
|
.aff-classiques-departs__info-bar-text {
|
|
color: var(--white);
|
|
font-size: 44px;
|
|
font-weight: 600;
|
|
font-family: "Achemine", sans-serif;
|
|
line-height: 1;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.aff-classiques-departs__bottom-clock {
|
|
display: inline-flex;
|
|
align-items: flex-start;
|
|
justify-content: center;
|
|
border: 2.5px solid rgba(255, 255, 255, 0.85);
|
|
border-radius: 6px;
|
|
padding: 6px 14px 4px 14px;
|
|
background: rgba(0, 24, 64, 0.45);
|
|
font-family: "Achemine", sans-serif;
|
|
flex-shrink: 0;
|
|
margin-right: 4px;
|
|
box-sizing: border-box;
|
|
height: 74px;
|
|
gap: 8px;
|
|
}
|
|
|
|
.aff-classiques-departs__bottom-clock-hm {
|
|
font-size: 52px;
|
|
font-weight: 700;
|
|
line-height: 1;
|
|
letter-spacing: 1.5px;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.aff-classiques-departs__bottom-clock-s {
|
|
font-size: 34px;
|
|
font-weight: 700;
|
|
line-height: 1;
|
|
letter-spacing: 0.5px;
|
|
color: var(--yellow) !important;
|
|
margin-top: 1px;
|
|
margin-left: 2px;
|
|
}
|
|
|