tobias
f5976e6865
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.
90 lines
4.9 KiB
Markdown
90 lines
4.9 KiB
Markdown
# 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 ~3990–4000 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.
|