Anpassung README
This commit is contained in:
22
README.md
22
README.md
@@ -1,13 +1,10 @@
|
|||||||
Super — hier ist die README.md **mit rohem Markdown** (also mit `#`, `*`, etc.), zum Kopieren:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
# Escape-Pad
|
# Escape-Pad
|
||||||
|
|
||||||
Interaktives Zahlen-Pad über einem Hintergrundbild (Indiana-Jones-Style).
|
Interaktives Zahlen-Pad über einem Hintergrundbild (Indiana-Jones-Style).
|
||||||
Vier Ziffern lassen sich über „Münz“-Klickflächen erhöhen/verringern.
|
Vier Ziffern lassen sich über „Münz“-Klickflächen erhöhen/verringern.
|
||||||
Ein Schlüssel-Button prüft den Code. Bei korrekter Eingabe wird der Pad-Inhalt geleert und eine frei definierbare Nachricht im Stil der Ziffern angezeigt. Code & Nachricht sind per Tastenkürzel änderbar und werden in `localStorage` gespeichert.
|
Ein Schlüssel-Button prüft den Code. Bei korrekter Eingabe wird der Pad-Inhalt geleert und eine frei definierbare Nachricht im Stil der Ziffern angezeigt. Code & Nachricht sind per Tastenkürzel änderbar und werden in `localStorage` gespeichert.
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Features
|
## Features
|
||||||
|
|
||||||
@@ -19,7 +16,6 @@ Ein Schlüssel-Button prüft den Code. Bei korrekter Eingabe wird der Pad-Inhalt
|
|||||||
- „Indiana-Jones“-Ziffernstile (graviert **oder** gestempelt)
|
- „Indiana-Jones“-Ziffernstile (graviert **oder** gestempelt)
|
||||||
- Barrierefrei: versteckter Text für Screenreader, `role="status"`
|
- Barrierefrei: versteckter Text für Screenreader, `role="status"`
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Projektstruktur
|
## Projektstruktur
|
||||||
|
|
||||||
@@ -32,11 +28,11 @@ Ein Schlüssel-Button prüft den Code. Bei korrekter Eingabe wird der Pad-Inhalt
|
|||||||
├─ back\_image\_new\.jpg # Hintergrundbild
|
├─ back\_image\_new\.jpg # Hintergrundbild
|
||||||
└─ key.png # Schlüssel-Button (PNG, transparent)
|
└─ key.png # Schlüssel-Button (PNG, transparent)
|
||||||
|
|
||||||
````
|
```
|
||||||
|
|
||||||
> Passe Dateinamen bei Bedarf in `index.html`/`style.css` an.
|
> Passe Dateinamen bei Bedarf in `index.html`/`style.css` an.
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Schnellstart
|
## Schnellstart
|
||||||
|
|
||||||
@@ -45,7 +41,7 @@ Ein Schlüssel-Button prüft den Code. Bei korrekter Eingabe wird der Pad-Inhalt
|
|||||||
3. F11 → Vollbild.
|
3. F11 → Vollbild.
|
||||||
4. Münzen ↑/↓ klicken, Code einstellen, Schlüssel anklicken.
|
4. Münzen ↑/↓ klicken, Code einstellen, Schlüssel anklicken.
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Tastenkürzel
|
## Tastenkürzel
|
||||||
|
|
||||||
@@ -59,7 +55,7 @@ Ein Schlüssel-Button prüft den Code. Bei korrekter Eingabe wird der Pad-Inhalt
|
|||||||
- `escape_code` (Array der 4 Ziffern)
|
- `escape_code` (Array der 4 Ziffern)
|
||||||
- Zurücksetzen: Seite neu laden **und** Site-Daten/LocalStorage löschen, oder neue Werte per Shortcut setzen.
|
- Zurücksetzen: Seite neu laden **und** Site-Daten/LocalStorage löschen, oder neue Werte per Shortcut setzen.
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Konfiguration
|
## Konfiguration
|
||||||
|
|
||||||
@@ -88,7 +84,6 @@ let code = JSON.parse(localStorage.getItem("escape_code") || "null") || DEFAULT_
|
|||||||
let solvedText = localStorage.getItem("escape_message") || "GEHEIMNIS GEÖFFNET";
|
let solvedText = localStorage.getItem("escape_message") || "GEHEIMNIS GEÖFFNET";
|
||||||
```
|
```
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Styling der Ziffern (Indy-Look)
|
## Styling der Ziffern (Indy-Look)
|
||||||
|
|
||||||
@@ -139,7 +134,6 @@ Binde **eine** der Fonts in `index.html` (vor `style.css`) ein und nutze die zug
|
|||||||
|
|
||||||
> Der Erfolgstext nutzt `.digit` erneut und wird über `.solvedText` größer skaliert.
|
> Der Erfolgstext nutzt `.digit` erneut und wird über `.solvedText` größer skaliert.
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Technische Hinweise
|
## Technische Hinweise
|
||||||
|
|
||||||
@@ -148,14 +142,12 @@ Binde **eine** der Fonts in `index.html` (vor `style.css`) ein und nutze die zug
|
|||||||
* **Events:** Münz-Klicks werden delegiert über `#pad` behandelt; Schlüssel-Button hat `id="openBtn"`.
|
* **Events:** Münz-Klicks werden delegiert über `#pad` behandelt; Schlüssel-Button hat `id="openBtn"`.
|
||||||
* **Erfolg:** Bei korrektem Code wird `#pad` geleert und eine `.solvedText.digit`-Nachricht eingesetzt (siehe CSS-Klasse `.pad--cleared`).
|
* **Erfolg:** Bei korrektem Code wird `#pad` geleert und eine `.solvedText.digit`-Nachricht eingesetzt (siehe CSS-Klasse `.pad--cleared`).
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Barrierefreiheit
|
## Barrierefreiheit
|
||||||
|
|
||||||
* Schlüssel-Button enthält visuell versteckten Text (`.visually-hidden`) für Screenreader.
|
* Schlüssel-Button enthält visuell versteckten Text (`.visually-hidden`) für Screenreader.
|
||||||
* Erfolgstext hat `role="status"` und `aria-live="polite"`.
|
* Erfolgstext hat `role="status"` und `aria-live="polite"`.
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Troubleshooting
|
## Troubleshooting
|
||||||
|
|
||||||
@@ -175,7 +167,7 @@ Binde **eine** der Fonts in `index.html` (vor `style.css`) ein und nutze die zug
|
|||||||
* **Cache leeren:**
|
* **Cache leeren:**
|
||||||
Harte Aktualisierung (Ctrl/Cmd + Shift + R).
|
Harte Aktualisierung (Ctrl/Cmd + Shift + R).
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Erweiterungen (Ideen)
|
## Erweiterungen (Ideen)
|
||||||
|
|
||||||
@@ -184,14 +176,14 @@ Binde **eine** der Fonts in `index.html` (vor `style.css`) ein und nutze die zug
|
|||||||
* Touch-Gesten (Wischen ↑/↓)
|
* Touch-Gesten (Wischen ↑/↓)
|
||||||
* Alternative „Öffnen“-Interaktion (z. B. Doppelklick)
|
* Alternative „Öffnen“-Interaktion (z. B. Doppelklick)
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Lizenz / Assets
|
## Lizenz / Assets
|
||||||
|
|
||||||
* **Google Fonts** (Cinzel, Special Elite): SIL Open Font License – Nutzung in Webprojekten erlaubt.
|
* **Google Fonts** (Cinzel, Special Elite): SIL Open Font License – Nutzung in Webprojekten erlaubt.
|
||||||
* **Eigene Bilder** (`back_image_new.jpg`, `key.png`): Bitte Rechteinhaberschaft sicherstellen.
|
* **Eigene Bilder** (`back_image_new.jpg`, `key.png`): Bitte Rechteinhaberschaft sicherstellen.
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Support
|
## Support
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user