Vollständiger Panel-companion-app-Paritätsaudit (11 Kapitel)
Systematischer Bildvergleich der companion-app gegen das HA-Panel (companion-app/AGENTS.md Kapitel 1-11): Farbtoken/Radien aus dem falschen Stylesheet gelesen (iOS-Overlay statt Basis-CSS, betraf fast jede Kachel/Farbe/Radius app-weit), vier app-weite @audi-dash/ui-Bugs (Switch/Seg/Feld rot statt neutral bzw. falsche Feldbreite), Reifen-Seite strukturell neu gebaut (beide Radsätze gleichzeitig statt Umschalter, editierbare Felder, Anzugsmoment-/km-Korrektur), Standort-Feature komplett neu (fehlte bisher ganz), sowie diverse Struktur-/Typografie-/Datenlücken in MeinAudi/Service/Versicherung/Sicherheit/Fahrten/Tanken/Statistik/Batterie/Einstellungen. Manifest auf 2026.8.30.2 angehoben, OTA-Bündel neu gebaut und in audi_ha_test verifiziert (sauberer Neustart, keine Tracebacks). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
@@ -11,22 +11,53 @@
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
/* Deckungsgleich mit .feld label in audi-dashboard-ios.css (16px,
|
||||
var(--fg)) - war hier fälschlich als gedämpfte 13px/--fg2-Eyebrow gebaut,
|
||||
derselbe Fehler wie bei .dm-wertzeile dt/dd (siehe die MeinAudi.tsx-
|
||||
Rebuild-Notiz weiter oben, Parität-Audit 2026-08-30) - dort schon
|
||||
korrigiert, hier nie nachgezogen, obwohl Feld weit öfter verwendet wird.
|
||||
flex:1 1 auto + min-width:0 (aus dem Basisblatt audi-dashboard.css, von
|
||||
der iOS-Auflage nicht neu gesetzt, bleibt also in Kraft): das Label nimmt
|
||||
den übrigen Platz der Zeile und bricht bei Bedarf um, statt mit dem
|
||||
Eingabefeld um Platz zu konkurrieren - ohne das brach ein langes Label
|
||||
wie "Pause zwischen zwei Fahrten" Wort für Wort in eine schmale Spalte
|
||||
um und quetschte das Eingabefeld zusammen (live beobachtet). */
|
||||
.ads-feld label {
|
||||
font-size: 13px;
|
||||
color: var(--fg2);
|
||||
font-size: 16px;
|
||||
color: var(--fg);
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
.ads-feld input,
|
||||
.ads-feld select {
|
||||
background: var(--tile-2);
|
||||
border: 1px solid var(--line);
|
||||
color: var(--fg);
|
||||
/* Deckungsgleich mit .feld input/.feld select in audi-dashboard-ios.css:
|
||||
background:var(--ios-fill) (war --tile-2, ein anderer, weiß- statt
|
||||
grau-basierter Farbwert), 16px statt 13.5px, Wert gedämpft (--fg2) bis
|
||||
zum Fokus, erst dort --fg (Parität-Audit 2026-08-30). min-width:0 statt
|
||||
einer festen 132px-Untergrenze (aus audi-dashboard.css übernommen,
|
||||
"min-width:0;max-width:100%;flex:0 1 auto") - eine feste Untergrenze
|
||||
verhinderte, dass das Feld dem Label (flex:1 1 auto oben) Platz
|
||||
abtritt; ohne sie füllte der native Browser-Standardwert (~170-190px
|
||||
ohne size-Attribut) dieselbe Lücke und quetschte lange Labels auf 0px
|
||||
zusammen (live beobachtet, "Pause bis"). */
|
||||
background: var(--ios-fill);
|
||||
border: none;
|
||||
color: var(--fg2);
|
||||
font-family: inherit;
|
||||
font-size: 13.5px;
|
||||
font-size: 16px;
|
||||
padding: 8px 11px;
|
||||
border-radius: var(--r-func);
|
||||
text-align: right;
|
||||
min-width: 132px;
|
||||
min-width: 0;
|
||||
max-width: 100%;
|
||||
flex: 0 1 auto;
|
||||
}
|
||||
|
||||
.ads-feld input:focus,
|
||||
.ads-feld select:focus {
|
||||
color: var(--fg);
|
||||
}
|
||||
|
||||
.ads-mit-einheit {
|
||||
@@ -35,8 +66,15 @@
|
||||
gap: var(--sp-2);
|
||||
}
|
||||
|
||||
/* Deckungsgleich mit .mitEinheit input in audi-dashboard.css: feste 96px,
|
||||
min-width auf 0 zurückgesetzt (schlägt sonst die ererbte 132px-Regel von
|
||||
.ads-feld input, siehe oben) - ohne das griff für die Zahl kein
|
||||
Breitenlimit, der native Browser-Standardwert (~170-190px) drängte das
|
||||
Label bei längeren Feldnamen wie "Pause bis" bis auf 0px zusammen (live
|
||||
beobachtet, Parität-Audit 2026-08-30). */
|
||||
.ads-mit-einheit input {
|
||||
min-width: 92px;
|
||||
width: 96px;
|
||||
min-width: 0;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,6 +1,11 @@
|
||||
.ads-fig {
|
||||
font-weight: 300;
|
||||
letter-spacing: -.02em;
|
||||
/* -.03em, nicht -.02em: die iOS-Auflage im Panel überschreibt .fig dort
|
||||
eigens (audi-dashboard-ios.css, live gemessen -1.8px bei 60px = -.03em)
|
||||
- das Basisblatt allein (audi-dashboard.css, -.02em) reicht am echten
|
||||
Panel nie aus, weil die Auflage immer mitgeladen wird (Parität-Audit
|
||||
2026-08-30, derselbe Fehler wie bei den Farb-Tokens). */
|
||||
letter-spacing: -.03em;
|
||||
line-height: .95;
|
||||
color: var(--fg);
|
||||
}
|
||||
|
||||
@@ -1,23 +1,34 @@
|
||||
/* Deckungsgleich mit .seg/.seg button/.seg button.on in audi-dashboard-ios.css
|
||||
(immer geladen, siehe die Parität-Audit-Funde weiter oben in diesem
|
||||
Projekt): eine gefüllte Spur mit einer verschiebbaren Pille, keine
|
||||
einzeln umrandeten Knöpfe, kein Rot - .ads-seg__on war hier bislang der
|
||||
pre-iOS-Entscheidung-Stil (Großschreibung, rote Umrandung), derselbe
|
||||
Fehler wie bei .ads-eyebrow/.ads-quad__l/TabBar. */
|
||||
.ads-seg {
|
||||
display: flex;
|
||||
gap: var(--sp-2);
|
||||
gap: 0;
|
||||
padding: 2px;
|
||||
background: var(--ios-fill);
|
||||
border-radius: 9px;
|
||||
}
|
||||
|
||||
.ads-seg button {
|
||||
flex: 1;
|
||||
border: 1px solid var(--line-strong);
|
||||
border: 0;
|
||||
background: none;
|
||||
color: var(--fg2);
|
||||
font-family: inherit;
|
||||
font-size: 11px;
|
||||
letter-spacing: .12em;
|
||||
text-transform: uppercase;
|
||||
padding: 11px 8px;
|
||||
border-radius: var(--r-pill);
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
padding: 7px 8px;
|
||||
border-radius: 7px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.ads-seg button.ads-seg__on {
|
||||
border-color: var(--red);
|
||||
background: var(--tile-2);
|
||||
color: var(--fg);
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
@@ -38,8 +38,8 @@
|
||||
}
|
||||
|
||||
.ads-switch input:checked + .ads-switch__track {
|
||||
background: var(--red);
|
||||
border-color: var(--red);
|
||||
background: var(--ok);
|
||||
border-color: var(--ok);
|
||||
}
|
||||
|
||||
.ads-switch input:checked + .ads-switch__track::before {
|
||||
|
||||
@@ -11,17 +11,26 @@
|
||||
padding: 10px 0 8px;
|
||||
background: none;
|
||||
border: none;
|
||||
border-top: 2px solid transparent;
|
||||
margin-top: -1px;
|
||||
color: var(--fg3);
|
||||
font-family: inherit;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* Aktiver Tab: eine graue Fläche hinter Icon+Beschriftung, kein Rot - Rot
|
||||
bleibt Akzent/destruktiv, nie Navigationsfarbe (dieselbe Regel wie beim
|
||||
Panel-Zurückpfeil, den primären Aktionsknöpfen und der Arbeitsweg-Pille).
|
||||
Werte 1:1 vom Panel übernommen (.tabbar:not(.ohne) .tab.on in
|
||||
audi-dashboard-ios.css) - kein bestehendes Token deckt genau diese Deckkraft
|
||||
ab (--shade ist .05/.04, hier .14/.07), deshalb hier direkt benannt, wie im
|
||||
Original. */
|
||||
.ads-tab--on {
|
||||
border-top-color: var(--red);
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
border-radius: 14px;
|
||||
color: var(--fg);
|
||||
}
|
||||
[data-theme="tag"] .ads-tab--on {
|
||||
background: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.ads-tab__icon svg {
|
||||
width: 21px;
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
:root {
|
||||
/* Markenunabhängig */
|
||||
--red: #F50537;
|
||||
--r-tile: 20px;
|
||||
--r-tile: 16px;
|
||||
--r-pill: 999px;
|
||||
--r-func: 8px;
|
||||
--rahmen-hg: #111;
|
||||
@@ -21,39 +21,46 @@
|
||||
--sp-4: 16px;
|
||||
--sp-5: 22px;
|
||||
|
||||
/* Nacht (Default-Theme, entspricht dem :root-Block des Originals) */
|
||||
--canvas: #161b23;
|
||||
--tile: #1f2733;
|
||||
--tile-2: #2a3341;
|
||||
--line: rgba(255, 255, 255, .10);
|
||||
--line-strong: rgba(255, 255, 255, .20);
|
||||
/* Nacht (Default-Theme). Bis 2026-08-30 standen hier die Werte aus dem
|
||||
*Basis*-Blatt audi-dashboard.css - das Panel lädt aber IMMER zusätzlich
|
||||
die iOS-Auflage (audi-dashboard-ios.css), die praktisch die gesamte
|
||||
Palette überschreibt (":host{--r-tile:16px...}" +
|
||||
":host([data-theme=nacht/tag])"). Live am echten Panel gemessen statt
|
||||
wieder nur aus der Basisdatei gelesen (Parität-Audit) - das ist die
|
||||
tatsächlich wirksame Palette, --r-tile oben eingeschlossen. */
|
||||
--canvas: #0C1014;
|
||||
--tile: rgba(255, 255, 255, .055);
|
||||
--tile-2: rgba(255, 255, 255, .10);
|
||||
--line: rgba(255, 255, 255, .13);
|
||||
--line-strong: rgba(255, 255, 255, .24);
|
||||
--fg: #FFFFFF;
|
||||
--fg2: #9aa1ad;
|
||||
/* Design-Audit A2: von #657081 (nur 3,0:1 auf --tile, WCAG AA verfehlt) auf
|
||||
4,9:1 angehoben. Das Panel hat diesen Wert bereits, hier war er noch der
|
||||
alte — nachgezogen, damit beide dasselbe zeigen. */
|
||||
--fg3: #8a94a3;
|
||||
--ok: #15da15;
|
||||
--warn: #ffaa00;
|
||||
--bad: #fd2c4e;
|
||||
--fg2: #BFC4CC;
|
||||
--fg3: #8E8E93;
|
||||
--ok: #30D158;
|
||||
--warn: #FFD60A;
|
||||
--bad: #FF453A;
|
||||
--shade: rgba(255, 255, 255, .05);
|
||||
/* Graue Füllfläche für Bedienelemente (Seg-Spur, Eingabe-/Auswahl-Boxen) -
|
||||
live am Panel gemessen (--ios-fill, audi-dashboard-ios.css). */
|
||||
--ios-fill: rgba(120, 120, 128, .24);
|
||||
|
||||
--font-stack: Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
[data-theme="tag"] {
|
||||
--canvas: #FFFFFF;
|
||||
--tile: #f2f2f2;
|
||||
--tile-2: #e5e5e5;
|
||||
--line: rgba(0, 0, 0, .10);
|
||||
--line-strong: rgba(0, 0, 0, .22);
|
||||
--canvas: #F2F2F7;
|
||||
--tile: #FFFFFF;
|
||||
--tile-2: #EFEFF4;
|
||||
--line: rgba(60, 60, 67, .13);
|
||||
--line-strong: rgba(60, 60, 67, .24);
|
||||
--fg: #000000;
|
||||
--fg2: #4c4c4c;
|
||||
--fg3: #666666;
|
||||
--ok: #0DA20D;
|
||||
--warn: #ffaa00;
|
||||
--bad: #eb0d3f;
|
||||
--fg2: #3C3C43;
|
||||
--fg3: #8E8E93;
|
||||
--ok: #34C759;
|
||||
--warn: #FF9F0A;
|
||||
--bad: #FF3B30;
|
||||
--shade: rgba(0, 0, 0, .04);
|
||||
--ios-fill: rgba(120, 120, 128, .16);
|
||||
}
|
||||
|
||||
/*
|
||||
@@ -78,9 +85,14 @@
|
||||
}
|
||||
|
||||
.ads-title {
|
||||
font-size: 23px;
|
||||
letter-spacing: -.015em;
|
||||
line-height: 1.15;
|
||||
/* Live am Panel gemessen (.title, audi-dashboard-ios.css): 22px,
|
||||
letter-spacing -.01em (war hier -.015em), line-height 1.2 (war 1.15) -
|
||||
beide kleinen Drifts nie dokumentiert, jetzt exakt angeglichen
|
||||
(Parität-Audit 2026-08-30, zusammen mit der 23px→22px-Korrektur vom
|
||||
2026-08-29). */
|
||||
font-size: 22px;
|
||||
letter-spacing: -.01em;
|
||||
line-height: 1.2;
|
||||
color: var(--fg);
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
Reference in New Issue
Block a user