From 2defdc98566f0fb7b505fdd3b27d1b96182e06d7 Mon Sep 17 00:00:00 2001 From: Andrej Stevanovski Date: Thu, 24 Sep 2026 21:47:52 +0200 Subject: [PATCH] =?UTF-8?q?Opa=20Martins=20Foto,=20kr=C3=A4ftigere=20Farbe?= =?UTF-8?q?n,=20Bugfixes?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Foto von Opa Martin eingesetzt (assets/opa-martin.jpg, 4:5) - Pastelle eine Stufe kräftiger (sun-200, sky-100, coral-100), Icon-Chips im Vollton, Hero-Weißschleier auf kurze Kante gekürzt, Header deckend - Kontraste auf den neuen Gründen neu gerechnet, Display-Typo dort dunklere Stufe - E-Mail bricht auf dem Handy nach dem @ statt mitten in gmail.com - Trust-Icons im Verein-Hero waren auf gleichfarbigem Grund unsichtbar - Footer 'Über uns' springt zur Geschichte statt auf die Startseite Co-Authored-By: Claude Opus 5.5 --- DESIGN.md | 33 +++++++++++++++++- README.md | 5 +-- assets/opa-martin.jpg | Bin 0 -> 72692 bytes assets/site.css | 79 +++++++++++++++++++++++++++--------------- datenschutz.html | 6 ++-- hilfe-verein.html | 6 ++-- impressum.html | 6 ++-- index.html | 9 +++-- shop.html | 4 +-- 9 files changed, 100 insertions(+), 48 deletions(-) create mode 100644 assets/opa-martin.jpg diff --git a/DESIGN.md b/DESIGN.md index 3939bd6..af140c6 100644 --- a/DESIGN.md +++ b/DESIGN.md @@ -28,7 +28,9 @@ neuer Hand. Dazu der **Hilfe Verein** („Hilfe. Herz. Hoffnung."), **noch nicht eingetragen** — deshalb keine Spendenstufen, kein Zahlungsformular, kein Mitgliedschafts-Flow. Drei Hilfearten, genau wie vom Kunden benannt: Geldspenden, ehrenamtliche Helfer, Weitersagen. Kontakt nur über `tel:` und `mailto:`. -**Opa Martin** ist der Inhaber; Bild und Name, kein Bildtext — Kundenvorgabe. +**Opa Martin** ist der Inhaber; Bild und Name, kein Bildtext — Kundenvorgabe. Foto seit +2026-09-24 in `assets/opa-martin.jpg`, 4:5 zugeschnitten, gleich behandelt wie das Story-Bild +(gekippt, weiß gerahmt). Der Online-Shop ist bewusst geparkt. Tonalität: **Du-Form**, Satzkleinschreibung, keine Emoji. ## Drei Abweichungen vom Handoff @@ -80,6 +82,35 @@ Coral bleibt unverändert **ausschließlich** Handlungsfarbe der primären Butto Eine bewusste Ausnahme: das Band *„Wo alles angefangen hat"* auf der Vereinsseite steht im Blau der Shop-Welt. Es verweist auf den Laden; die Tönung markiert den Themenwechsel. +### 1b. Kräftigere Tönungen (2026-09-24) + +Zweite Rückmeldung des Auftraggebers: die Farben wirken **„zu transparent"**. Gemessen +lag das an drei Stellen: den 50/100-Pastellen (`--sky-50`, `--sun-100`, `--coral-50`) +mit Leuchtdichte nahe Weiß, dem halbtransparenten Weißschleier im Hero, der bis 820px +über dem Foto lag, und dem durchscheinenden Header (`rgba(255,255,255,.92)`). + +Begründung aus derselben Referenz: [`emmas-schatzkiste-ds.md`](../design-references/entries/emmas-schatzkiste-ds.md) +hält bereits fest, dass *Pastell allein in dieser Familie nicht trägt*. Das wird jetzt +eine Stufe weiter gezogen, ohne neue Farbfamilie: + +| Rolle | vorher | jetzt | +|---|---|---| +| Creme-Flächen, Footer, Verein-Hero | `--sun-100` `#FDF4DC` | `--sun-200` `#FBE3A0` (neu) | +| Blaue Flächen, Shop-Hero | `--sky-50` / Weiß | `--sky-100` `#CFE6F8` | +| Rosa Kachel | `--coral-50` | `--coral-100` `#FFD8CE` (neu) | +| Icon-Chips | Pastell mit farbigem Icon | Vollton `--accent`, weißes Icon (3.86 / 3.92) | +| Hero-Verlauf | Weiß bis 430px, Schleier bis 820px | Fläche bis zur Textspalte, 90px Kante | +| Header | 92 % Weiß mit Blur | deckend Weiß | + +Die Kacheln im gelben Band der Vereinsseite tragen jetzt ihre Tönung (rosa, blau, gelb) +statt einheitlich Weiß. + +**Kontrast neu gerechnet.** Auf den kräftigeren Gründen fallen die hellen Buntwerte auf +~3.0–3.1. Deshalb stehen H1-Zeilen, Band-Überschriften und der Name unter dem Porträt dort +in der dunkleren Stufe derselben Familie: auf `--sun-200` `--sky-600` 4.43 · `--sun-700` +4.11 · `--coral-600` 3.93; auf `--sky-100` 4.35 · 4.04 · 3.87. Fließtext auf getöntem Grund +ist `--ink-700` (≥ 11.0). + ### 2. Kontrast Guardrail: *„Graue Schrift auf farbigem Grund."* Gemessen statt geschätzt: diff --git a/README.md b/README.md index 5ccaa9c..a702f43 100644 --- a/README.md +++ b/README.md @@ -46,10 +46,7 @@ cd "/Users/andrej/ASX Studio/Emmas schatzkiste" && python3 -m http.server 4173 ### Vom Kunden ausstehend -3. **Foto von Opa Martin.** Der Slot auf der Startseite ist 1:1 und beschriftet. Bild - einsetzen: den `
` durch - `Opa Martin` ersetzen — der Kommentar steht an - der Stelle. Bild und Name, kein Bildtext (Kundenvorgabe). +3. ~~**Foto von Opa Martin.**~~ Erledigt 2026-09-24 (`assets/opa-martin.jpg`). 4. **Zwei Audiodateien** — ein Lied für den Laden, eines für den Verein. Bis dahin ist der Player sichtbar deaktiviert, mit Badge „Audio folgt". Beim Einbau: je ein `
@@ -173,7 +173,7 @@

Über