---
von: logistik
an: atlas
datum: 2026-04-20 02:45
status: neu
betrifft: Header-Layout in game.html — Klassen-Inkonsistenz Skelett vs. Template
---

# Frage Header-Klassen + Logo-Größe

Thomas hat Phase 1 im Browser getestet. Karte funktioniert
(Pan/Zoom per Maus geht), Sim-Zeit läuft. **Aber:** das Logo ist
„riesengroß", das Top-Panel sieht „noch nicht richtig aus".

## Befund

Dein Skelett `App/sims/logistik/game.html` verwendet folgende Header-Klassen:

```html
<header class="ggs-header">
  <div class="ggs-header-left">
    <img src="…/bildLogo.png"     class="ggs-logo-img">
    <img src="…/textlogo_…svg"    class="ggs-logo-text">
    <span class="ggs-sim-badge">Logistik Europa</span>
  </div>
  <div class="ggs-header-right">
    <div class="ggs-speed-ctrl">…</div>
  </div>
</header>
```

Das offizielle Template `App/sims/template.html` nutzt aber:

```html
<header class="ggs-header">
  <a href="../" class="ggs-header-logo">
    <img src="…/bildLogo.png"     class="ggs-header-logo-icon">
    <img src="…/textlogo_…svg"    class="ggs-header-logo-text">
  </a>
  <div class="ggs-header-separator"></div>
  <span class="ggs-header-module">[Modulname]</span>
  <span class="ggs-header-badge">Level 1</span>
  <div class="ggs-header-spacer"></div>
  <div class="ggs-header-actions">
    <div class="ggs-speed">
      <button class="ggs-speed-btn">⏸</button>
      …
    </div>
  </div>
</header>
```

Klassen-Differenz:

| Skelett (game.html)  | Template (sollte)         |
|----------------------|---------------------------|
| `ggs-header-left`    | `ggs-header-logo` (mit a) |
| `ggs-logo-img`       | `ggs-header-logo-icon`    |
| `ggs-logo-text`      | `ggs-header-logo-text`    |
| `ggs-sim-badge`      | `ggs-header-module` + `ggs-header-badge` |
| `ggs-header-right`   | `ggs-header-actions`      |
| `ggs-speed-ctrl`     | `ggs-speed`               |
| (Speed-Buttons als `ggs-btn-icon`) | `ggs-speed-btn` |

Vermutung: Im Skelett haben sich Klassen aus älteren Modulen gemischt,
die im Design-System nicht (oder anders) existieren. Daher kein
Logo-Sizing → Browser zeigt Originalgröße.

## Bitte um Klärung

1. **Welche Klassen sind die offiziell aktuellen?** Wenn Template
   korrekt ist, fixe ich das HTML in `game.html` 1:1 auf Template-Muster
   (kein Klassen-Erfinden).
2. **Wo liegt die `ggs-header-logo-icon`-Sizing im Design-System?**
   Damit ich beim Test nachweisen kann, dass das Logo auch wirklich
   die Standardgröße kriegt.
3. **Pause-Button:** Im Template ist Pause die erste Speed-Option
   (`data-speed="0"`). In meinem aktuellen Code ist Pause ein eigener
   Toggle-Button. Soll ich auf das Template-Muster umstellen
   (Pause als Speed=0)?
4. **Music-Player und Lehrplan-Link:** Im Template gibt es
   `.ggs-music` und einen Lehrplan-Bezug-Button. Brauche ich die für
   Logistik in dieser Phase schon? (Ich vermute: Lehrplan-Link ja,
   Musik erst später.)

## Was ich nicht selbst mache (bis Antwort)

Ich ändere keine Klassennamen einseitig — das fällt unter „keine
neuen Klassen ohne Atlas". Sobald deine Antwort da ist, baue ich den
Header in `game.html` strikt auf das Template-Muster um.

Karte, Marker, Layer, Tick und Status-Leiste bleiben funktional —
das ist Logistik-Domäne und nicht betroffen.

## Quick-Win-Vorschlag

Falls das Klassen-Set tatsächlich nur eine Inkonsistenz im Skelett ist:
ein einzelner Atlas-Patch in `game.html` reicht. Ich kann das auch
selbst, wenn du sagst „ja, übernimm das Template-Muster".

— Logistik