# M0 Screenshot- und Designreferenz

Stand: 2026-07-11

Diese Checkliste friert die bestehende Optik ein, damit die SaaS-App vertraut
bleibt. Wenn die Legacy-App lokal nicht laeuft, koennen Screenshots aus der
aktuellen Umgebung geliefert werden.

## Allgemeine Vorgaben

- Je Seite Desktop mit ca. 1440 px Breite aufnehmen.
- Je Kernseite mobile Ansicht mit ca. 390 px Breite aufnehmen.
- Je relevanter Rolle aufnehmen: normales Mitglied und Admin.
- Keine echten personenbezogenen Daten veroeffentlichen.
- Dateinamen nach Muster `m0-<rolle>-<seite>-<viewport>.png`.

## Kernseiten

| Prioritaet | Seite | Rolle | Zweck |
| --- | --- | --- | --- |
| Hoch | `index.php` | Mitglied | Dashboard, Saldo, Jahreswerte, eigene Striche, PayPal |
| Hoch | `index.php` | Admin | Dashboard mit Admin-Sidebar |
| Hoch | `kaffeeliste.php` | Admin | Gesamtuebersicht und Aktionsleiste |
| Hoch | `stricheintragen.php` | Admin | Sammelerfassung Striche |
| Hoch | `einzahlung.php` | Admin | Sammelerfassung Einzahlungen |
| Hoch | `mitarbeiterverwalten.php` | Admin | Mitgliederliste und Formular |
| Hoch | `letzteneintraege.php` | Admin | Korrekturansicht mit Loeschaktionen |
| Mittel | `csvupload.php` | Admin | CSV-Upload-Formular und Ergebniszustand |
| Mittel | `hinweise.php` | Admin | Hinweise anlegen und Liste |
| Mittel | `faq.php` | Mitglied | FAQ-Inhalte und Typografie |
| Mittel | `namenanpassen.php` | Mitglied | Formular fuer Anzeigenamen |
| Niedrig | `teilnehmerauswertung.php` | Admin | Detailauswertung pro Teilnehmer |
| Niedrig | `mailausgebe.php` | Admin | Mail-/Adressausgabe |
| Niedrig | `umfrage.php` | Mitglied | Randmodul, falls SaaS-relevant |
| Niedrig | `umfrageergebnisse.php` | Admin | Randmodul, falls SaaS-relevant |

## Zustaende

Diese UI-Zustaende sollten, wenn moeglich, separat gesichert werden:

- Positiver Kontostand.
- Negativer Kontostand.
- Nullsaldo.
- Nutzer ohne Zugriff.
- Erfolgreiche Stricherfassung.
- Erfolgreiche Einzahlung.
- CSV-Import mit Erfolg, Dublette und unbekanntem Nutzer.
- Hinweisbanner aktiv.
- Leere Tabellen oder keine Daten.
- Mobile Sidebar geoeffnet und geschlossen.

## Designmerkmale, die erhalten bleiben sollen

- Gruener Akzent fuer Links, Buttons und Linien.
- Roboto-Slab-Ueberschriften.
- Open-Sans-Fliesstext.
- Weisse Hauptflaeche.
- Graue Sidebar in der App.
- Tabellen als zentrale Datenansicht.
- Schlichte Formularfelder und Buttons.
- Ruhige, arbeitsorientierte Darstellung.

## Ablage

Empfohlene lokale Ablage, falls Screenshots ins Repo sollen:

```text
docs/m0/screenshots/
```

Vor dem Commit sollten Screenshots anonymisiert sein. Wenn echte Namen,
E-Mails, PayPal-Daten oder Salden sichtbar sind, besser ausserhalb des Repos
ablegen und nur als Referenz verwenden.