/* Ergänzungen zum übernommenen Grundstil (style.css) und das dunkle Farbschema. Was dort schon steht, wird dort genutzt und hier nicht nachgebaut. Eine Namensklärung vorweg, weil sie sonst dauerhaft verwirrt: Im übernommenen Stil heißt .karte eine Inhaltskachel. Die Landkarte dieses Werkzeugs heißt deshalb .landkarte. */ /* ===================================================================== Dunkles Farbschema Palette wie in MD-Assist und im Bewerbermanagement. Dunkel ist die Voreinstellung und steht direkt im :root -- so gibt es beim Laden kein kurzes Aufblitzen einer hellen Seite. Wer lieber hell arbeitet, setzt ueber den Umschalter im Kopf data-thema="hell" auf ; ein winziges Skript im jeder Seite liest die Wahl aus dem Sitzungsspeicher, bevor der Stil greift. ===================================================================== */ :root { --bg:#12171F; --surface:#1A212B; --ink:#E6EBF2; --ink-soft:#93A1B5; --line:#2C3644; --blue:#60A5FA; --blue-deep:#93C5FD; --blue-tint:#1B2A41; --yellow:#FCD34D; --yellow-ink:#FCD34D; --yellow-tint:#3A2F0B; --green:#86EFAC; --green-ink:#86EFAC; --green-tint:#14351F; --red:#FCA5A5; --red-tint:#3D1618; --lightblue:#7DD3FC; --purple:#C4A0C2; --gray-ink:#93A1B5; --gray-tint:#232B36; --eingabe-bg:#141A23; --auf-akzent:#0B1017; --schatten:rgba(0,0,0,.45); --logo-navy:#9CC5EC; --logo-papier:#12171F; /* Die Landkarte. Rasterkacheln sind hell gerendert; auf dunklem Grund werden sie gedaempft, damit die Route darauf noch lesbar bleibt. */ --karten-filter: brightness(.72) saturate(.85) contrast(1.05); --karten-grund:#0E1319; --route:#60A5FA; --route-rand:#0B1017; /* Die eigene Vektorkarte. Gedaempft und kontrastarm gehalten: Sie ist Hintergrund, nicht Inhalt -- die Route muss darauf sofort ins Auge fallen. */ --karte-siedlung:#1C222C; --karte-wasser:#1E3A52; --karte-bahn:#3A4350; --karte-strasse-klein:#2E3641; --karte-strasse-mittel:#414B59; --karte-strasse-gross:#5A6675; } :root[data-thema="hell"] { --bg:#F4F7FA; --surface:#FFFFFF; --ink:#17262B; --ink-soft:#5A6B70; --line:#DFE6EC; --blue:#003E77; --blue-deep:#002C55; --blue-tint:#E4EDF6; --yellow:#FFD405; --yellow-ink:#8F7400; --yellow-tint:#FFF7D1; --green:#4DAF45; --green-ink:#2F7A29; --green-tint:#E7F5E5; --red:#B2452F; --red-tint:#F9E9E5; --lightblue:#70CAF3; --purple:#A862A4; --gray-ink:#5A6B70; --gray-tint:#ECEFF0; --eingabe-bg:#FFFFFF; --auf-akzent:#FFFFFF; --schatten:rgba(23,38,43,.14); --logo-navy:#003E77; --logo-papier:#FFFFFF; --karten-filter: none; --karten-grund:#EEF2F5; --route:#003E77; --route-rand:#FFFFFF; --karte-siedlung:#E3E8EC; --karte-wasser:#BFD8E8; --karte-bahn:#B4BCC4; --karte-strasse-klein:#D6DCE2; --karte-strasse-mittel:#BCC5CE; --karte-strasse-gross:#9AA6B2; } /* ===================================================================== Eingabefelder style.css setzt background:#fff hart auf input, select und textarea. Auf dunklem Grund stand die Schrift damit weiss auf weiss -- in Auswahlfeldern war schlicht nichts zu lesen. color-scheme ist der zweite Teil und wichtiger, als er aussieht: Ohne diese Angabe zeichnet der Browser die Aufklappliste eines