Picos Formular-Hoehe zurueckgenommen (v=172)

User: die Textfelder des laufenden Trades sind viel zu hoch.

ZWEI Pico-Regeln waren schuld:
 (1) input{height:calc(1rem*line-height + spacing-vertical*2 + border*2)} --
     mit --pico-form-element-spacing-vertical:0.75rem sind das ~3rem = 48px.
     Unsere .tb-field-Regel setzt nur padding, KEINE Hoehe -- also gewann Pico.
 (2) input{margin-bottom:var(--pico-spacing)} -- nochmal 0,7rem darunter.

height:auto laesst wieder das eigene Padding die Hoehe bestimmen; margin-bottom:0
entfernt den Formular-Abstand. Checkbox/Radio/Range ausgenommen (eigene
Groessenlogik).

Rechnerisch am Handy (Wurzel 16px): vorher ~50px, jetzt ~30px.

Das ist die erste Stelle, an der Pico sichtbar durchgeschlagen hat -- genau der
Fall, den ich beim Einbau angekuendigt habe. Die Bruecke im Kopf von style.css
ist der Ort fuer weitere solche Ruecknahmen.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Axel Hocks
2026-08-19 00:41:48 +02:00
co-authored by Claude Opus 5
parent 572c6c0253
commit 3b5706c6bb
2 changed files with 14 additions and 2 deletions
+2 -2
View File
@@ -12,7 +12,7 @@
⚠ 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">
<link rel="stylesheet" href="style.css?v=172">
</head>
<body>
<!-- Modul-Menü (ganz oben) -->
@@ -362,6 +362,6 @@
</div>
<div id="toast" class="toast hidden"></div>
<script src="app.js?v=171"></script>
<script src="app.js?v=172"></script>
</body>
</html>