214 lines
5.6 KiB
JavaScript
214 lines
5.6 KiB
JavaScript
// ==UserScript==
|
|
// @name HVV Styling (39C3 Kiosk)
|
|
// @namespace http://tampermonkey.net/
|
|
// @version 2025-12-18
|
|
// @description try to take over the world!
|
|
// @author You
|
|
// @match https://www.hvv.de/de/fahrplaene/abruf-fahrplaninfos/abfahrten-auf-ihrem-monitor/abfahrten-anzeige?show=66c992574d6c4179a65009c84f0f74fc
|
|
// @icon https://www.google.com/s2/favicons?sz=64&domain=hvv.de
|
|
// @grant GM_addStyle
|
|
// ==/UserScript==
|
|
|
|
(function() {
|
|
'use strict';
|
|
|
|
GM_addStyle(`:root {
|
|
--color-neutral-50: #f2f0f5;
|
|
--color-neutral-100: #d1c6e0;
|
|
--color-neutral-200: #b2a0cb;
|
|
--color-neutral-300: #957eb5;
|
|
--color-neutral-400: #7a60a0;
|
|
--color-neutral-500: #61468b;
|
|
--color-neutral-600: #4b3176;
|
|
--color-neutral-700: #371f60;
|
|
--color-neutral-800: #26114b;
|
|
--color-neutral-900: #180736;
|
|
--color-neutral-950: #0c011f;
|
|
--color-argon-50: #e1abc9;
|
|
--color-argon-100: #da87b5;
|
|
--color-argon-200: #d464a1;
|
|
--color-argon-300: #cd448f;
|
|
--color-argon-400: #c6257d;
|
|
--color-argon-500: #b0166f;
|
|
--color-argon-600: #9a0a61;
|
|
--color-argon-700: #830755;
|
|
--color-argon-800: #6d0449;
|
|
--color-argon-900: #56023c;
|
|
--color-argon-950: #3f012d;
|
|
--color-krypton-50: #b2d9ea;
|
|
--color-krypton-100: #8cc9e4;
|
|
--color-krypton-200: #69bade;
|
|
--color-krypton-300: #4badd8;
|
|
--color-krypton-400: #2493c2;
|
|
--color-krypton-500: #167fac;
|
|
--color-krypton-600: #0a6c96;
|
|
--color-krypton-700: #075c81;
|
|
--color-krypton-800: #044c6b;
|
|
--color-krypton-900: #023c55;
|
|
--color-krypton-950: #012c3f;
|
|
--color-green-50: #c0f49a;
|
|
--color-green-100: #a7e57a;
|
|
--color-green-200: #8fd75d;
|
|
--color-green-300: #7ac843;
|
|
--color-green-400: #66b92d;
|
|
--color-green-500: #54aa18;
|
|
--color-green-600: #47990f;
|
|
--color-green-700: #397e0a;
|
|
--color-green-800: #2b6206;
|
|
--color-green-900: #1f4703;
|
|
--color-green-950: #122b01;
|
|
--color-red-50: #e6afaf;
|
|
--color-red-100: #dd9090;
|
|
--color-red-200: #d57272;
|
|
--color-red-300: #cc5757;
|
|
--color-red-400: #c33d3d;
|
|
--color-red-500: #bb2626;
|
|
--color-red-600: #b21010;
|
|
--color-red-700: #950808;
|
|
--color-red-800: #780404;
|
|
--color-red-900: #5c0202;
|
|
--color-red-950: #3f0101;
|
|
--color-yellow-50: #fefce8;
|
|
--color-yellow-100: #fef9c2;
|
|
--color-yellow-200: #fff085;
|
|
--color-yellow-300: #ffdf20;
|
|
--color-yellow-400: #fdc700;
|
|
--color-yellow-500: #efb100;
|
|
--color-yellow-600: #d08700;
|
|
--color-yellow-700: #a65f00;
|
|
--color-yellow-800: #894b00;
|
|
--color-yellow-900: #733e0a;
|
|
--color-yellow-950: #432004;
|
|
|
|
--color-white: #ffffff;
|
|
|
|
--color-dark-foreground: var(--color-neutral-50);
|
|
--color-dark-background: var(--color-neutral-950);
|
|
--color-dark-shade-1: var(--color-neutral-900);
|
|
--color-dark-shade-2: var(--color-neutral-800);
|
|
--color-dark-shade-3: var(--color-neutral-700);
|
|
--color-dark-shade-4: var(--color-neutral-600);
|
|
--color-dark-text-1: rgba(250, 245, 245, 0.8);
|
|
--color-dark-text-2: var(--color-neutral-300);
|
|
--color-dark-text-3: var(--color-neutral-400);
|
|
--color-dark-text-4: var(--color-neutral-500);
|
|
--color-dark-primary: var(--color-argon-400);
|
|
--color-dark-secondary: #9673ff;
|
|
--color-dark-error: var(--color-red-500);
|
|
--color-dark-success: var(--color-green-500);
|
|
--color-dark-warning: var(--color-yellow-500);
|
|
--color-dark-accent-1: #60a5f9;
|
|
--color-dark-accent-2: #d381f7;
|
|
--color-dark-accent-3: #ff7975;
|
|
|
|
--color-light-foreground: var(--color-neutral-950);
|
|
--color-light-background: var(--color-neutral-50);
|
|
--color-light-shade-1: var(--color-neutral-100);
|
|
--color-light-shade-2: var(--color-neutral-200);
|
|
--color-light-shade-3: var(--color-neutral-300);
|
|
--color-light-shade-4: var(--color-neutral-400);
|
|
--color-light-text-1: var(--color-neutral-800);
|
|
--color-light-text-2: var(--color-neutral-700);
|
|
--color-light-text-3: var(--color-neutral-600);
|
|
--color-light-text-4: var(--color-neutral-500);
|
|
--color-light-primary: var(--color-argon-600);
|
|
--color-light-secondary: var(--color-krypton-500);
|
|
--color-light-error: var(--color-red-600);
|
|
--color-light-success: var(--color-green-600);
|
|
--color-light-warning: var(--color-yellow-600);
|
|
--color-light-accent-1: #303ec0;
|
|
--color-light-accent-2: #6c366c;
|
|
--color-light-accent-3: #932f0a;
|
|
|
|
--color-cmyk-primary: var(--color-dark-primary);
|
|
--color-cmyk-secondary: var(--color-dark-secondary);
|
|
|
|
--line-height-loose: 1.4;
|
|
--line-height-relaxed: 1.3;
|
|
--line-height-base: 1.2;
|
|
--line-height-snug: 1.1;
|
|
--line-height-tight: 1;
|
|
|
|
--text-xs: 0.75rem;
|
|
--text-sm: 0.875rem;
|
|
--text-base: 1rem;
|
|
--text-lg: 1.125rem;
|
|
--text-xl: 1.25rem;
|
|
--text-2xl: 1.5rem;
|
|
--text-3xl: 1.875rem;
|
|
--text-4xl: 2.25rem;
|
|
--text-5xl: 3rem;
|
|
--text-6xl: 3.75rem;
|
|
--text-7xl: 4.5rem;
|
|
|
|
--container-3xs: 16rem;
|
|
--container-2xs: 18rem;
|
|
--container-xs: 20rem;
|
|
--container-sm: 24rem;
|
|
--container-md: 28rem;
|
|
--container-lg: 32rem;
|
|
--container-xl: 36rem;
|
|
--container-2xl: 42rem;
|
|
--container-3xl: 48rem;
|
|
--container-4xl: 56rem;
|
|
--container-5xl: 64rem;
|
|
--container-6xl: 72rem;
|
|
--container-7xl: 80rem;
|
|
}
|
|
|
|
#page-content, .f-body {
|
|
margin: 0;
|
|
padding: 0
|
|
}
|
|
|
|
.o-headline1 {
|
|
color: rgb(102, 246, 102);
|
|
font-size: 3em
|
|
}
|
|
|
|
.o-headline2 {
|
|
color: var(--color-dark-secondary);
|
|
font-size: 3em
|
|
}
|
|
|
|
.js-span-station-name {
|
|
color: var(--color-dark-text-1);
|
|
font-size: 1.5em
|
|
}
|
|
|
|
.o-table table{
|
|
color: var(--color-dark-text-1);
|
|
font-size: 2em
|
|
}
|
|
|
|
.o-transport-icon {
|
|
transform: scale(2);
|
|
color: var(--color-argon-600);
|
|
margin-left: 20px !important;
|
|
}
|
|
|
|
.c-departures-monitor__delay-time.is-late {
|
|
color: #ff3719;
|
|
}
|
|
|
|
.c-departures-monitor__delay-time.is-on-time {
|
|
color: #009900;
|
|
}
|
|
|
|
.c-departures-monitor__logo {
|
|
opacity: 0.7
|
|
}
|
|
|
|
body {
|
|
background-color: #141414;
|
|
}
|
|
.js-span-station-name {
|
|
margin: 0 !important;
|
|
}
|
|
|
|
.o-transport-icon--transparent .o-transport-icon__number {
|
|
color: #faf5f5 !important;
|
|
}
|
|
|
|
`);
|
|
})();
|