Tourismus-Icons: Reduzierte-Animation als Funkeln (durchgestrichen wenn

aktiv), Tal-Log-Glocke, Tal-Meldungsmodus Sprechblase/ABC

- Komponente: generisches Zwei-Zustands-Icon (.ic-state-on/.ic-state-off
  via .active) -> reduzierte Animation zeigt durchgestrichenes Funkeln.
- Region: Schildkroete -> Funkeln (mit Aus-Zustand).
- Tal: btnLog -> Glocken-SVG; _syncInfoModeBtn -> Sprechblase (Audio) /
  ABC (Lese-Modus) statt Emoji (Buch war fuers Glossar vergeben).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
2026-08-25 19:50:57 +02:00
parent 2e9ad6a83f
commit 248a46f829
4 changed files with 11 additions and 3 deletions
+5
View File
@@ -182,6 +182,11 @@
width: 20px;
height: 20px;
}
/* Zwei-Zustands-Icon: .ic-state-on normal, .ic-state-off wenn Button .active.
(z. B. Animationen an → reduziert = durchgestrichen) */
.ggs-header--float button .ic-state-off { display: none; }
.ggs-header--float button.active .ic-state-on { display: none; }
.ggs-header--float button.active .ic-state-off { display: inline-block; }
/* --- Tempo-Zustandsbutton (zeigt IMMER den aktuellen Speed) --- */
.ggs-header--float .ggs-tempo { position: relative; display: inline-flex; }
+1 -1
View File
@@ -31,7 +31,7 @@
<button id="btnLog" class="icon-btn" title="Meldungen"><svg class="ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M18 8.5a6 6 0 0 0-12 0c0 6-2.5 7.5-2.5 7.5h17S18 14.5 18 8.5z"/><path d="M13.7 19a2 2 0 0 1-3.4 0"/></svg><span id="logBadge" class="badge hidden">0</span></button>
<button id="btnSound" class="icon-btn" title="Sound an/aus">🔊</button>
<button id="btnMusic" class="icon-btn" title="Musik-Player">🎵</button>
<button id="btnAnim" class="icon-btn" title="Reduzierte Animationen"><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.5 15a5.5 4 0 0 1 11 0"/><path d="M15.4 13.7c1.4-.5 3-.1 3.5 1.1"/><circle cx="19.2" cy="13" r=".5" fill="currentColor" stroke="none"/><path d="M6.5 15.2v2M9.7 15.6v2.2M12.7 15.6v2.2M15.3 15.2v2"/></svg></button>
<button id="btnAnim" class="icon-btn" title="Reduzierte Animationen"><svg class="ic ic-state-on" viewBox="0 0 24 24" fill="currentColor"><path d="M10.5 3.2l1.6 4.3 4.3 1.6-4.3 1.6-1.6 4.3-1.6-4.3L4.6 9.1l4.3-1.6z"/><path d="M17.5 13l.85 2.15L20.5 16l-2.15.85L17.5 19l-.85-2.15L14.5 16l2.15-.85z"/></svg><svg class="ic ic-state-off" viewBox="0 0 24 24"><path fill="currentColor" d="M10.5 3.2l1.6 4.3 4.3 1.6-4.3 1.6-1.6 4.3-1.6-4.3L4.6 9.1l4.3-1.6z"/><path fill="currentColor" d="M17.5 13l.85 2.15L20.5 16l-2.15.85L17.5 19l-.85-2.15L14.5 16l2.15-.85z"/><path d="M3.6 3.6l16.8 16.8" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round"/></svg></button>
<button id="btnCamera" class="icon-btn" title="Ansicht zurücksetzen"><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="7.5"/><circle cx="12" cy="12" r="3"/><path d="M12 2.5v3M12 18.5v3M2.5 12h3M18.5 12h3"/></svg></button>
<button id="btnHelp" class="icon-btn" title="Anleitung">?</button>
</div>
+1 -1
View File
@@ -27,7 +27,7 @@
<button data-speed="4" class="icon-btn speed-btn ggs-speed-btn" title="Sehr schnell">4×</button>
</div>
<button id="btnInfoMode" class="icon-btn" title="Meldungs-Modus umschalten">📖</button>
<button id="btnLog" class="icon-btn" title="Meldungen">🔔<span id="logBadge" class="badge hidden">0</span></button>
<button id="btnLog" class="icon-btn" title="Meldungen"><svg class="ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M18 8.5a6 6 0 0 0-12 0c0 6-2.5 7.5-2.5 7.5h17S18 14.5 18 8.5z"/><path d="M13.7 19a2 2 0 0 1-3.4 0"/></svg><span id="logBadge" class="badge hidden">0</span></button>
<button id="btnSound" class="icon-btn" title="Sound an/aus">🔊</button>
<button id="btnMusic" class="icon-btn" title="Musik an/aus">🎵</button>
<button id="btnHelp" class="icon-btn" title="Anleitung &amp; Info"></button>
+4 -1
View File
@@ -232,7 +232,10 @@ export class UI {
_syncInfoModeBtn(btn) {
if (!btn) return;
btn.textContent = this.infoMode === 'audio' ? '🔊' : '📖';
// Audio-Modus = Sprechblase (vorgelesen) · Lese-Modus = „ABC" (Text)
const speech = '<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 5.5h16a1.5 1.5 0 0 1 1.5 1.5v7a1.5 1.5 0 0 1-1.5 1.5h-7l-4 3v-3H4A1.5 1.5 0 0 1 2.5 14V7A1.5 1.5 0 0 1 4 5.5z"/><circle cx="8.5" cy="10.5" r=".95" fill="currentColor" stroke="none"/><circle cx="12" cy="10.5" r=".95" fill="currentColor" stroke="none"/><circle cx="15.5" cy="10.5" r=".95" fill="currentColor" stroke="none"/></svg>';
const abc = '<svg class="ic" viewBox="0 0 24 24"><text x="12" y="16" text-anchor="middle" font-size="9" font-weight="800" font-family="Inter, system-ui, sans-serif" fill="currentColor">ABC</text></svg>';
btn.innerHTML = this.infoMode === 'audio' ? speech : abc;
btn.title = this.infoMode === 'audio'
? 'Audio-Modus: Meldungen werden vorgelesen (umschalten auf Lese-Modus)'
: 'Lese-Modus: Meldungen pausieren das Spiel (umschalten auf Audio-Modus)';