# 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 läuft, können 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 veröffentlichen.
- Dateinamen nach Muster `m0-<rolle>-<seite>-<viewport>.png`.

## Kernseiten

| Priorität | Seite | Rolle | Status | Zweck |
| --- | --- | --- | --- | --- |
| Hoch | `index.php` | Mitglied | vorhanden: `m0-member-dashboard-desktop.png`, `m0-member-dashboard-mobile.png` | Dashboard, Saldo, Jahreswerte, eigene Striche, PayPal |
| Hoch | `index.php` | Admin | aktuell identisch wie Mitglied | Dashboard mit Admin-Sidebar |
| Hoch | `kaffeeliste.php` | Admin | vorhanden: `m0-admin-kaffeeliste-desktop.png` | Gesamtübersicht und Aktionsleiste |
| Hoch | `stricheintragen.php` | Admin | vorhanden: `m0-admin-stricheintragen-desktop.png` | Sammelerfassung Striche |
| Hoch | `einzahlung.php` | Admin | vorhanden: `m0-admin-einzahlung-desktop.png` | Sammelerfassung Einzahlungen |
| Hoch | `mitarbeiterverwalten.php` | Admin | vorhanden: `m0-admin-mitglieder-desktop.png` | Mitgliederliste und Formular |
| Hoch | `letzteneintraege.php` | Admin | vorhanden: `m0-admin-letzteneintraege-desktop.png` | Korrekturansicht mit Löschaktionen |
| Mittel | `csvupload.php` | Admin | vorhanden: `m0-admin-csv-upload-desktop.png` | CSV-Upload-Formular und Ergebniszustand |
| Mittel | `hinweise.php` | Admin | vorhanden: `m0-admin-hinweise-desktop.png` | Hinweise anlegen und Liste |
| Mittel | `faq.php` | Mitglied | vorhanden: `m0-member-faq-desktop.png` | FAQ-Inhalte und Typografie |
| Mittel | `namenanpassen.php` | Mitglied | offen | Formular für Anzeigenamen |
| Niedrig | `teilnehmerauswertung.php` | Admin | offen | Detailauswertung pro Teilnehmer |
| Niedrig | `mailausgebe.php` | Admin | offen | Mail-/Adressausgabe |
| Niedrig | `umfrage.php` | Mitglied | offen, falls SaaS-relevant | Randmodul, falls SaaS-relevant |
| Niedrig | `umfrageergebnisse.php` | Admin | offen, falls SaaS-relevant | Randmodul, falls SaaS-relevant |

## Gelieferte Dateien

```text
docs/m0/screenshots/m0-admin-einzahlung-desktop.png
docs/m0/screenshots/m0-admin-csv-upload-desktop.png
docs/m0/screenshots/m0-admin-hinweise-desktop.png
docs/m0/screenshots/m0-admin-kaffeeliste-desktop.png
docs/m0/screenshots/m0-admin-letzteneintraege-desktop.png
docs/m0/screenshots/m0-admin-mitglieder-desktop.png
docs/m0/screenshots/m0-admin-stricheintragen-desktop.png
docs/m0/screenshots/m0-member-dashboard-desktop.png
docs/m0/screenshots/m0-member-dashboard-mobile.png
docs/m0/screenshots/m0-member-faq-desktop.png
```

## Zustände

Diese UI-Zustände sollten, wenn möglich, 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 geöffnet und geschlossen.

## Designmerkmale, die erhalten bleiben sollen

- Grüner Akzent für Links, Buttons und Linien.
- Roboto-Slab-Überschriften.
- Open-Sans-Fließtext.
- Weiße Hauptfläche.
- 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 außerhalb des Repos
ablegen und nur als Referenz verwenden.