Workspace: Auswahllisten und Kalender in dunkler Darstellung

Die aufgeklappte Liste eines <select> zeichnet der Browser selbst, CSS
erreicht sie nicht. Ohne Hinweis geht er von einer hellen Seite aus und
malt sie weiss -- die helle Schrift darauf war praktisch unlesbar
(gemeldet mit Screenshot).

Behebung ueber color-scheme: dark auf <html>. Das ist der Schalter fuer
alles, was der Browser selbst zeichnet: Auswahllisten, Datumskalender,
Bildlaufleisten, Textmarkierung. Zusaetzlich sind Hintergrund und
Schriftfarbe an <option> gesetzt, weil aeltere Browser und manche
Linux-Oberflaechen color-scheme nur teilweise beachten.

Damit entfallen die beiden filter: invert(.75) am Kalendersymbol der
Datumsfelder -- der Browser zeichnet es jetzt schon hell, invert haette
es wieder verdunkelt.

Nur statische Dateien, kein Neustart noetig.

workspace/assets/css/aufgaben.css

@@ -54,8 +54,10 @@
   outline: none; border-color: rgba(63, 189, 245, .7);
   box-shadow: 0 0 0 3px rgba(63, 189, 245, .16);
 }
-/* Der Kalender-Knopf im Datumsfeld ist sonst fast schwarz auf dunkel. */
-.neu input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(.75); cursor: pointer; }
+/* Aufhellen ist nicht mehr noetig: color-scheme: dark (gate.css) laesst den
+   Browser das Kalendersymbol schon hell zeichnen. Ein invert() wuerde es hier
+   wieder verdunkeln. */
+.neu input[type="date"]::-webkit-calendar-picker-indicator { cursor: pointer; }
 
 /* ---------- Brett ----------------------------------------------------- */
 

workspace/assets/css/gate.css

@@ -30,7 +30,21 @@
 
 *, *::before, *::after { box-sizing: border-box; }
 
-html { -webkit-text-size-adjust: 100%; }
+/* `color-scheme: dark` ist der eigentliche Schalter für alles, was der
+   Browser selbst zeichnet und was CSS nicht erreicht: die aufgeklappte
+   Liste eines <select>, den Kalender eines Datumsfeldes, Bildlaufleisten,
+   die Textmarkierung. Ohne diese Zeile geht der Browser von einer hellen
+   Seite aus und malt die Auswahlliste weiss -- die helle Schrift darauf
+   war dann praktisch unlesbar. */
+html { -webkit-text-size-adjust: 100%; color-scheme: dark; }
+
+/* Zusätzlich die Einträge selbst setzen. Ältere Browser und Linux-
+   Oberflächen ignorieren color-scheme teilweise; diese beiden Zeilen
+   wirken auch dort. */
+option {
+  background-color: #0d131d;
+  color: var(--text);
+}
 
 body.gate {
   margin: 0;

workspace/assets/css/profil.css

@@ -33,7 +33,8 @@
   outline: none; border-color: rgba(63, 189, 245, .7);
   box-shadow: 0 0 0 3px rgba(63, 189, 245, .16);
 }
-.gruppe input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(.75); cursor: pointer; }
+/* Siehe aufgaben.css: color-scheme: dark erledigt das Aufhellen. */
+.gruppe input[type="date"]::-webkit-calendar-picker-indicator { cursor: pointer; }
 
 .gruppe__raster {
   display: grid; gap: 14px; margin-top: 16px;