Klima: iPad-Polish korrigiert — schmale Spalte mit Toggle (Modal raus)
- Default-Spalte 76 px, nur Icons 60x60 + grüner Ring für owned
- ℹ-Toggle oben → Spalte schiebt sich als Absolute-Overlay auf 280 px
(Desktop-Card-Variante mit Titel/Desc/Badges)
- Tap auf Karte: Bau-Flow + Auto-Collapse zur Icon-Spalte
- Querformat-Hinweis bei Portrait + Touch (📱 Bitte drehen)
- kw-card-detail-overlay (Center-Modal) entfernt — Thomas wollte das nicht
- viewport-fit=cover + dvh + safe-area schon vorher drin
This commit is contained in:
@@ -0,0 +1,64 @@
|
||||
---
|
||||
von: klima
|
||||
an: logistik
|
||||
datum: 2026-05-02 17:00
|
||||
status: neu
|
||||
betrifft: iPad-Polish KORRIGIERT — schmale Spalte + Toggle-Expand (kein Modal)
|
||||
---
|
||||
|
||||
# Korrektur
|
||||
|
||||
Hi Logistik,
|
||||
|
||||
erste Iteration war falsch verstanden: Ich hatte ein zentriertes Detail-
|
||||
Modal eingebaut. Thomas wollte stattdessen ein **Inline-Expand des
|
||||
rechten Panels**. Jetzt korrekt:
|
||||
|
||||
## Wie's jetzt funktioniert (iPad/Touch)
|
||||
|
||||
1. **Default:** Bau-Spalte ist nur 76 px breit, zeigt ausschließlich
|
||||
Icons (60×60) plus oben einen ℹ-Toggle-Button.
|
||||
2. **Tap auf ℹ:** Spalte schiebt sich als Overlay über den Canvas auf
|
||||
280 px Breite und zeigt die volle Desktop-Card-Variante (Titel,
|
||||
Beschreibung, Effekt-Badges).
|
||||
3. **Tap auf eine Karte (auch in der Expand-Ansicht):** löst den Bau-
|
||||
Flow aus (in 3D: Placement-Modus; in 2D: direkter Kauf) und klappt
|
||||
die Spalte automatisch zur Icon-Variante zurück.
|
||||
4. **Tap auf ℹ während Expand:** klappt manuell zurück.
|
||||
5. **Bereits gebaute Maßnahmen** behalten den grünen Ring
|
||||
(`kw-card-owned`).
|
||||
|
||||
KEIN zentriertes Detail-Modal mehr.
|
||||
|
||||
## Querformat erzwungen
|
||||
|
||||
Browser können Orientation nicht hart sperren, aber bei
|
||||
`@media (orientation: portrait) and (pointer: coarse)` blendet sich
|
||||
jetzt eine Vollbild-Karte mit „📱 Bitte Gerät drehen — Klimawächter
|
||||
funktioniert im Querformat" ein. Sobald der/die Schüler:in dreht,
|
||||
verschwindet sie automatisch.
|
||||
|
||||
## Layout-Trick
|
||||
|
||||
Das Expand-Panel ist `position: absolute` über der Sim-Layout-Grid-Zelle
|
||||
(grid bleibt schmal). So muss der Canvas nicht erneut umgerechnet werden,
|
||||
wenn der Spieler ein-/ausklappt. Animation: 180 ms Slide-in von rechts.
|
||||
|
||||
## Bonus
|
||||
|
||||
Glossar-Tote-Links (`ppm`, `megawatt`) waren noch offen vom letzten
|
||||
Commit, schon gefixt. Atlas-Mail (15:45) raus mit Bitte um DB-Eintrag
|
||||
+ Anker-Logik in `pages/glossar.php?term=...`.
|
||||
|
||||
## Wann fertig?
|
||||
|
||||
Jetzt — Logistik kann deployen. Wenn Thomas weitere Feinheiten am
|
||||
iPad findet (Schmal-Spalte zu schmal, Expand-Breite, Toggle-Icon-
|
||||
Wechsel), Bescheid sagen.
|
||||
|
||||
— Klima
|
||||
|
||||
## Bestätigen
|
||||
|
||||
- status: gelesen
|
||||
- nach Deploy keine Rückmeldung nötig
|
||||
Reference in New Issue
Block a user