PicoCSS v2.1.1 als Basisschicht eingebunden (v=171)

User-Wunsch "schreibe auf pico css um". ⚠ EHRLICH ZUM UMFANG: Pico ist KLASSENLOS -- es stylt semantisches HTML (button, input, article, nav), nicht die ~60 Trading-Klassen (.card, .tb-field, .m15-item, .px ...). Ein echtes "Umschreiben" ist damit gar nicht moeglich; was geht, ist eine SCHICHT: Pico liefert Typografie, Formulare, Buttons und Fokus-Ringe, style.css steht DANACH und gewinnt bei Konflikten. LOKAL eingebunden (83 KB), kein CDN: die PWA laeuft ueber WireGuard und muss offline funktionieren; ein CDN-Link waere zudem CSP-blockiert. Damit Pico das Dashboard nicht in sein Standard-Blau umfaerbt, sind seine Variablen auf die BESTEHENDE Palette gemappt (--pico-* -> --bg/--card/--accent ...). Zwei Pico-Defaults bewusst ausgeschaltet: - --pico-font-size: 100% -- Picos eigene fluide Schrift wuerde sich mit html{font-size:clamp(...)} vom 13.08. MULTIPLIZIEREN. - Block-Abstaende auf 0,7rem gezaehmt; die Karten bringen ihre eigenen mit. Dazu drei Ruecknahmen, wo Picos Container-Regeln mit dem Grid kollidieren. Verifiziert am laufenden Server: pico.min.css HTTP 200 (83.319 Bytes), style.css 200, data-theme=dark im ausgelieferten HTML, und die Reihenfolge stimmt (Pico Zeile 14, style.css Zeile 15). Nebenbefund: das CDN antwortete sofort -- das Netz ist in Ordnung, nur Gitea ist weiterhin nicht erreichbar. Backups: index.html.bak-2026-08-19-pico, style.css.bak-2026-08-19 Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-08-19 00:36:11 +02:00
parent d03d6a1a50
commit 572c6c0253
4 changed files with 422 additions and 3 deletions
@@ -1,12 +1,18 @@
 <!DOCTYPE html>
-<html lang="de">
+<html lang="de" data-theme="dark">
 <head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
  <meta name="theme-color" content="#0d1117">
  <title>Oil · MT5</title>
  <link rel="manifest" href="manifest.json">
-  <link rel="stylesheet" href="style.css?v=170">
+  <!-- ⚠ Pico ZUERST: es liefert die Basis (Typografie, Formulare,
+       Buttons, Fokus-Ringe). `style.css` kommt DANACH und gewinnt bei
+       Konflikten — die ~60 Trading-Klassen bleiben unveraendert.
+       ⚠ LOKAL eingebunden, kein CDN: die PWA laeuft ueber WireGuard
+       und muss offline funktionieren. -->
+  <link rel="stylesheet" href="pico.min.css?v=1">
+  <link rel="stylesheet" href="style.css?v=171">
 </head>
 <body>
  <!-- Modul-Menü (ganz oben) -->
@@ -356,6 +362,6 @@
  </div>
  <div id="toast" class="toast hidden"></div>

-  <script src="app.js?v=170"></script>
+  <script src="app.js?v=171"></script>
 </body>
 </html>