Eingabefelder zoomen nicht mehr: 16px setzen sich jetzt auch durch

Beim Antippen eines Feldes auf dem Willkommensbildschirm zoomte iOS die
ganze Seite heran und machte sie verschiebbar. Ursache war nicht eine
fehlende Regel, sondern eine unterlegene: grundlage.css und .dm-eingabe
setzen laengst 16px, aber @audi-dash/ui setzt ".ads-feld input" auf 13.5px -
Klasse plus Typ schlaegt die blosse Klasse. Unterhalb von 16px zoomt iOS
beim Fokus, das ist der ganze Mechanismus.

Behoben mit einem spezifischeren Selektor im App-CSS, gleicher Wert wie
ohnehin beabsichtigt. @audi-dash/ui bleibt unangetastet, wie schon beim
type=date-Fall darunter.

Bewusst nicht genommen: user-scalable=no im Viewport. Das haette das
Symptom in einer Zeile versteckt, nimmt aber allen das Aufziehen - und
dasselbe Buendel wird auch als Web-App aus Home Assistant ausgeliefert.
This commit is contained in:
Paul Nothaft
2026-08-29 13:34:07 +02:00
parent 4e97656a75
commit 4fa5d4bc2d
3 changed files with 33 additions and 0 deletions
+19
View File
@@ -4710,6 +4710,25 @@ has been offered such an app, which by then it has. Worth knowing for a project
posture: Developer Mode loosens the device's debugging restrictions, so it is a deliberate trade for posture: Developer Mode loosens the device's debugging restrictions, so it is a deliberate trade for
being able to sideload at all. being able to sideload at all.
**First real-device finding: tapping a field zoomed the whole screen.** Reported on the Willkommen
screen — focus an input, iOS scales the page up and it becomes pannable, which reads as broken in a
native shell. Cause was **not** a missing rule but a losing one. `grundlage.css` and `.dm-eingabe`
both already set inputs to 16px precisely to avoid this (it is an old audit finding from the panel),
but `@audi-dash/ui`'s `.ads-feld input` sets **13.5px**, and class+type beats a bare class — so the
design-system value won everywhere a field sits inside `Feld`, which is everywhere. Below 16px iOS
auto-zooms on focus; that is the whole mechanism.
Fixed in `companion-app/src/stile/screens.css` with `.ads-feld input.dm-eingabe,
.ads-feld select.dm-auswahl { font-size: 16px }` — same value as already intended, just specific
enough to land. `@audi-dash/ui` stays untouched, matching the precedent set by the `type=date`
override directly below it in the same file. Verified in the built CSS (override present, higher
specificity, later in the file) and inside the packaged `.ipa`.
Deliberately **not** used: `user-scalable=no` / `maximum-scale=1` in the viewport meta. It would have
hidden the symptom in one line, but it disables pinch-zoom for everyone, and the same bundle is also
served as a web app from Home Assistant. Fixing the font size removes the cause and keeps zoom
available.
**Still open at end of session:** this Mac is logged out of Tailscale (`BackendState: NeedsLogin`), **Still open at end of session:** this Mac is logged out of Tailscale (`BackendState: NeedsLogin`),
which is moot while Gitea hosts the install (section AJ). which is moot while Gitea hosts the install (section AJ).
Also untouched: `MARKETING_VERSION` is still `1.0`/`1` from the Capacitor scaffold, so successive Also untouched: `MARKETING_VERSION` is still `1.0`/`1` from the Capacitor scaffold, so successive
Binary file not shown.
+14
View File
@@ -24,6 +24,20 @@
color: var(--fg3); color: var(--fg3);
} }
/* Die 16px oben sind nicht Geschmack, sondern Pflicht: unterhalb davon zoomt
iOS beim Antippen eines Eingabefelds die ganze Seite heran, danach lässt
sich die Ansicht verschieben - in einer nativen Hülle wirkt das wie ein
Fehler (Nutzerbefund 2026-08-29, Willkommensbildschirm).
Sie kamen bisher nie an: @audi-dash/ui setzt ".ads-feld input" auf 13.5px,
und dieser Selektor ist spezifischer (Klasse + Typ) als das bloße
".dm-eingabe" - er gewinnt also, egal in welcher Reihenfolge geladen wird.
Deshalb hier dieselbe Angabe noch einmal, spezifisch genug um zu greifen.
@audi-dash/ui bleibt unangetastet, wie schon beim type=date-Fall unten. */
.ads-feld input.dm-eingabe,
.ads-feld select.dm-auswahl {
font-size: 16px;
}
/* type="date": ohne appearance-Reset behält Safari/WKWebView (die iOS-Hülle /* type="date": ohne appearance-Reset behält Safari/WKWebView (die iOS-Hülle
dieser App) sein eigenes, stark abgerundetes natives Eingabe-Chrome statt dieser App) sein eigenes, stark abgerundetes natives Eingabe-Chrome statt
der Box-Optik aus @audi-dash/ui's Feld - beim Nutzer sichtbar als der Box-Optik aus @audi-dash/ui's Feld - beim Nutzer sichtbar als