Files
audi-app/AUDI_CI_ARCHIV_2026-08-13.md
tobias f5976e6865 iOS-Optik offiziell machen, Audi-CI-Spezifikation vorher archivieren
Entscheidung nach DESIGN_REVIEW_2026-08-13.md §A, Option 1: die additive
iOS-Auflage (audi-dashboard-ios.css) wird zur verbindlichen Optik erklaert,
statt die App auf reine Audi-CI zurueckzuschneiden. Der bisherige
SPECIFICATION.md-§2-Wortlaut (Audi-CI-Farben, 20px-Radius) ist wortgleich
in AUDI_CI_ARCHIV_2026-08-13.md gesichert, inklusive Anleitung fuer den
Rueckweg - der Code selbst braucht dafuer kein Backup, da die iOS-Auflage
rein additiv ist und die Audi-CI-Basiswerte in audi-dashboard.css
unveraendert erhalten bleiben.

SPECIFICATION.md §2 beschreibt jetzt die tatsaechlichen iOS-Werte aus
audi-dashboard-ios.css. bauauftrag.md §8 bleibt unangetastet (Projekt-
konvention: historisches Dokument), gilt aber ab hier als ueberholt.

Zwei aus demselben Review noch offene Implementierungsfehler (Rot-Semantik
invertiert, 20px/16px-Radius-Inkonsistenz bei Popups) sind unabhaengig von
dieser Richtungsentscheidung und bleiben offen.

Zusaetzlich: Versionsbump nach dem Redeploy in audi_ha_test.
2026-08-13 19:20:28 +02:00

4.9 KiB
Raw Permalink Blame History

Audi-CI-Design — Archiv (Stand 2026-08-13, vor der iOS-Offizialisierung)

Warum diese Datei existiert: SPECIFICATION.md §2 „Concept & Design System" beschrieb bis 2026-08-13 das ursprüngliche, reine Audi-CI-Design des Panels — Nacht-Canvas #161b23, 20-px- Kachelradius, Rot nur als Akzent, keine Schatten. Mit der Entscheidung, die iOS-Auflage (audi-dashboard-ios.css) offiziell zur verbindlichen Optik zu machen (siehe DESIGN_REVIEW_2026-08-13.md §A, Option 1, und der entsprechende AGENTS.md-Eintrag), wurde §2 umgeschrieben, um die iOS-Werte zu beschreiben. Diese Datei bewahrt den vorherigen Wortlaut wortgleich, falls die Entscheidung später zurückgenommen wird.

Wichtig — das ist nicht die einzige Absicherung: Der Code selbst macht die Rückkehr trivial, unabhängig von dieser Datei. audi-dashboard-ios.css ist eine rein additive Auflage (homeassistant/www/audi-dashboard-app.js, Zeile ~39904000 lädt zuerst audi-dashboard.css, dann zusätzlich audi-dashboard-ios.css) — die Basisdatei audi-dashboard.css enthält die Audi-CI-Werte weiterhin vollständig und unverändert. Um zur reinen Audi-CI zurückzukehren, genügt es, das Laden von audi-dashboard-ios.css in _aufbauen() zu entfernen bzw. bedingt zu machen — kein Restore aus einem Backup nötig. Diese Datei dokumentiert die Spezifikationstexte, nicht den Code (der bleibt ohnehin vorhanden).

Bekannter Nebenpunkt aus dem Design-Review: die korrigierte --fg3-Kontrastfarbe (#8a94a3, siehe unten) ist in bauauftrag.md §8 nicht nachgezogen — dort steht noch der ursprüngliche, kontrastschwache Wert #657081. Diese Archivdatei hier gibt daher den zuletzt tatsächlich gültigen Stand wieder, nicht bauauftrag.md.


Ursprünglicher Wortlaut von SPECIFICATION.md §2 (vor 2026-08-13)

Visual language

Dark ("Nacht") is the default and primary theme; a light ("Tag") theme exists as a toggle. No shadows, no gradients anywhere except the fade under the vehicle photo (.szene). Flat tiles, pill-shaped controls, hairline dividers.

Colors (CSS custom properties, defined per-theme via :root / [data-theme="tag"])

Role Nacht (default) Tag
--canvas (page background) #161b23 #FFFFFF
--tile #1f2733 #f2f2f2
--tile-2 (inputs, hover) #2a3341 #e5e5e5
--line rgba(255,255,255,.10) rgba(0,0,0,.10)
--line-strong rgba(255,255,255,.20) rgba(0,0,0,.22)
--fg #FFFFFF #000000
--fg2 (secondary text) #9aa1ad #4c4c4c
--fg3 (labels/eyebrows) #8a94a3 #666666
--ok #15da15 #0DA20D
--warn #ffaa00 #ffaa00
--shade rgba(255,255,255,.05) rgba(0,0,0,.04)
--bad #fd2c4e #eb0d3f
--red (accent, theme-independent) #F50537 #F50537

--red is used sparingly (accents, active states, destructive actions), not as a background fill.

Radii

  • --r-tile: 20px — tiles, the vehicle-photo "scene" container.
  • --r-pill: 999px — buttons, switches, segmented controls, progress bars.
  • Small functional elements (form inputs, placeholder/mini image boxes, popups) use hardcoded literal pixel values (6px / 12px / 14px respectively) rather than a shared token.

Typography

Three font-family names in play, all under the trademarked "Audi Type" family, embedded inline as base64 woff2 directly in audi-dashboard.css (private-install only):

  • "Audi Type" — body/UI text, weight 400.
  • "Audi Type Wide", weight 300 — .fig class, used for large numeric figures (odometer, range, tank %, prices, service countdowns).
  • "Audi Type Extended", italic — .sport class and the vehicle-title badge suffix (.badge .zusatz).

Only weights 300 and 400 are shipped — never use font-weight: 600 or higher; the browser would synthetically bold. Numbers are formatted via de-DE locale (thousands separator, comma decimals) through the de()/eur() helpers.

Licensing constraint (hard rule)

The Audi Type font, the four-rings SVG, and the model badge SVGs (www/badges/*.svg) are licensed/trademarked assets, cleared only for this one private, non-published installation (bauauftrag §8, §12). Never extract, republish, or reuse them anywhere outside this specific Home Assistant instance.


So kommst du zurück

  1. In homeassistant/www/audi-dashboard-app.js, _aufbauen(): die vier Zeilen, die linkIos erzeugen und an ROOT anhängen, entfernen (oder hinter eine Bedingung stellen).
  2. SPECIFICATION.md §2 durch den obigen Wortlaut ersetzen (oder auf diese Datei verweisen und den iOS-Absatz als „überholt" markieren, symmetrisch zur jetzigen Umkehrung).
  3. AGENTS.md entsprechend nachziehen (die Design-Review-Entscheidung als zurückgenommen vermerken).
  4. audi-dashboard-ios.css selbst muss nicht gelöscht werden — ungeladen hat sie keine Wirkung.