Adminator/geograsim
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Heli: vorhandene Phasen-Links auf App-Icon-Stil (Option 2, kein Umbau)

Browse Source 
Home/Hilfe/Uebersichtskarte als schwebende Icon-Buttons (Home/?/Karten-Pin)
statt Text/Emoji; Positionen als Icon-Cluster angepasst. Kein Header-Umbau,
keine JS-Aenderung (IDs/Handler unveraendert).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Thomas
2026-08-25 22:57:18 +02:00
parent 93c742b381
commit b109ebb099
1 changed files with 11 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
App/sims/heli/game.html
+11 -10
View File
@@ -105,11 +105,12 @@
.btn-big:hover{background:#1a3a1e}
.btn-outline{background:transparent;color:var(--forest);border:2px solid var(--forest);margin-left:.5rem}
/* Karten-Link (Atlas-Spielhilfe) — sichtbar in Auftragswahl + Routenplanung */
.heli-map-link{position:absolute;top:.6rem;right:.6rem;z-index:1500;display:inline-flex;align-items:center;gap:.3rem;background:#fff;color:var(--forest);text-decoration:none;border:1.5px solid var(--forest);border-radius:8px;padding:.35rem .55rem;font-size:.75rem;font-weight:700;box-shadow:0 2px 6px rgba(0,0,0,.08)}
.heli-map-link:hover{background:var(--forest);color:#fff}
.heli-map-link{position:absolute;top:.6rem;right:.6rem;z-index:1500;width:38px;height:38px;padding:0;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.96);color:#1f4e5a;text-decoration:none;border:none;border-radius:12px;box-shadow:0 2px 9px rgba(0,0,0,.2);cursor:pointer}
.heli-map-link:hover{background:#fff}
.heli-map-link .ic,.heli-home-link .ic,.heli-help-link .ic{width:20px;height:20px}
/* Hauptmenue-Link in Auftragswahl (oben links neben Mission-Badge) */
.heli-home-link{position:absolute;top:.6rem;left:4.5rem;z-index:1500;display:inline-flex;align-items:center;gap:.3rem;background:#fff;color:var(--forest);text-decoration:none;border:1.5px solid var(--forest);border-radius:8px;padding:.35rem .55rem;font-size:.75rem;font-weight:700;box-shadow:0 2px 6px rgba(0,0,0,.08)}
.heli-home-link:hover{background:var(--forest);color:#fff}
.heli-home-link{position:absolute;top:.6rem;left:4.5rem;z-index:1500;width:38px;height:38px;padding:0;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.96);color:#1f4e5a;text-decoration:none;border:none;border-radius:12px;box-shadow:0 2px 9px rgba(0,0,0,.2);cursor:pointer}
.heli-home-link:hover{background:#fff}
/* Mission-ID-Badge — fix oben links, sichtbar in allen Phasen ab Auswahl */
#missionBadge{position:fixed;top:.5rem;left:.5rem;z-index:9000;background:rgba(31,75,55,.92);color:#f5efe0;font-weight:800;font-size:.78rem;letter-spacing:.05em;padding:.3rem .55rem;border-radius:6px;box-shadow:0 2px 6px rgba(0,0,0,.18);pointer-events:none;font-family:system-ui,sans-serif}
@@ -140,8 +141,8 @@
.heli-onb-btn-secondary{background:transparent;color:var(--forest);border:1.5px solid var(--forest)}
.heli-onb-btn-secondary:hover{background:rgba(45,84,52,.06)}
/* Spielhilfe-Re-Open-Button in der Einsatzzentrale */
.heli-help-link{position:absolute;top:.6rem;right:11rem;z-index:1500;display:inline-flex;align-items:center;gap:.3rem;background:#fff;color:var(--forest);border:1.5px solid var(--forest);border-radius:8px;padding:.35rem .55rem;font-size:.75rem;font-weight:700;box-shadow:0 2px 6px rgba(0,0,0,.08);cursor:pointer;font-family:inherit}
.heli-help-link:hover{background:var(--forest);color:#fff}
.heli-help-link{position:absolute;top:.6rem;right:3.6rem;z-index:1500;width:38px;height:38px;padding:0;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.96);color:#1f4e5a;border:none;border-radius:12px;box-shadow:0 2px 9px rgba(0,0,0,.2);cursor:pointer;font-family:inherit}
.heli-help-link:hover{background:#fff}
/* === Glossar-Begriffe (Tooltip/Popup) === */
.heli-glossar-term{cursor:help;border-bottom:1px dashed rgba(45,84,52,.5);text-decoration:none;color:inherit}
.heli-glossar-term:hover{border-bottom-color:var(--forest);background:rgba(45,84,52,.06)}
@@ -160,9 +161,9 @@
<!-- PHASE 1: Auftragswahl -->
<div class="phase active" id="phase-mission">
<a id="heliHomeLink" class="heli-home-link" href="#" title="Zurück zur Modul-Auswahl (Cockpit)">← Hauptmenü</a>
<button type="button" class="heli-help-link" onclick="startHeliOnboarding(true)" title="Spielhilfe erneut anzeigen">❓ Spielhilfe</button>
<a id="heliMapLinkMission" class="heli-map-link" href="#" target="_blank" rel="noopener" title="Übersichtskarte aller Stützpunkte und Missionen">📍 Übersichtskarte</a>
<a id="heliHomeLink" class="heli-home-link" href="#" title="Zurück zur Modul-Auswahl (Cockpit)"><svg class="ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M4 11.4 12 4l8 7.4"/><path d="M6 10.3V19a1 1 0 0 0 1 1h3v-5h4v5h3a1 1 0 0 0 1-1v-8.7"/></svg></a>
<button type="button" class="heli-help-link" onclick="startHeliOnboarding(true)" title="Spielhilfe erneut anzeigen"><svg class="ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="8.4"/><path d="M9.7 9.3a2.4 2.4 0 0 1 4.6.8c0 1.6-2.3 1.8-2.3 3.2"/><circle cx="12" cy="16.4" r=".7" fill="currentColor" stroke="none"/></svg></button>
<a id="heliMapLinkMission" class="heli-map-link" href="#" target="_blank" rel="noopener" title="Übersichtskarte aller Stützpunkte und Missionen"><svg class="ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12 21s6.5-5.5 6.5-10.5A6.5 6.5 0 0 0 5.5 10.5C5.5 15.5 12 21 12 21z"/><circle cx="12" cy="10.3" r="2.4"/></svg></a>
<div class="mission-header">
<h1>🚁 Einsatzzentrale</h1>
<p>Wähle deinen Einsatz — der Hubschrauber wartet.</p>
@@ -191,7 +192,7 @@
<!-- PHASE 2: Routenplanung -->
<div class="phase" id="phase-plan">
<a id="heliMapLinkPlan" class="heli-map-link" href="#" target="_blank" rel="noopener" title="Übersichtskarte aller Stützpunkte und Missionen">📍 Übersichtskarte</a>
<a id="heliMapLinkPlan" class="heli-map-link" href="#" target="_blank" rel="noopener" title="Übersichtskarte aller Stützpunkte und Missionen"><svg class="ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12 21s6.5-5.5 6.5-10.5A6.5 6.5 0 0 0 5.5 10.5C5.5 15.5 12 21 12 21z"/><circle cx="12" cy="10.3" r="2.4"/></svg></a>
<div class="plan-bar">
<h2>📍 Routenplanung</h2>
<span id="planProgress" style="font-size:.72rem;color:var(--slate)">Wegpunkt 1/5</span>