This commit is contained in:
team3
2026-07-13 19:36:57 +02:00
parent e51cecda6e
commit c16ef5415f
2 changed files with 10 additions and 2 deletions

View File

@@ -56,9 +56,16 @@ const gesperrt = computed(() =>
&& !fertig.value.has(screen.value.baustein)) && !fertig.value.has(screen.value.baustein))
function vor() { if (!gesperrt.value && pos.value < screens.value.length - 1) pos.value++ } function vor() { if (!gesperrt.value && pos.value < screens.value.length - 1) pos.value++ }
function zurueck() { if (pos.value > 0) pos.value-- } function zurueck() { if (pos.value > 0) pos.value-- }
const buehne = ref(null)
function taste(e) { function taste(e) {
if (e.key === 'ArrowRight') vor() if (e.key === 'ArrowRight') vor()
else if (e.key === 'ArrowLeft') zurueck() else if (e.key === 'ArrowLeft') zurueck()
// Pfeil hoch/runter scrollen die Bühne — der innere Scroller hat nie Fokus,
// ohne das hier bewegen die Tasten also gar nichts
else if (e.key === 'ArrowDown' || e.key === 'ArrowUp') {
e.preventDefault()
buehne.value?.scrollBy({ top: e.key === 'ArrowDown' ? 140 : -140, behavior: 'smooth' })
}
} }
// Wisch-Navigation (mobil): klar horizontal + kurz genug = blättern. // Wisch-Navigation (mobil): klar horizontal + kurz genug = blättern.
@@ -185,7 +192,7 @@ onUnmounted(() => {
<button class="lm-x" title="Schließen" @click="schliessen"></button> <button class="lm-x" title="Schließen" @click="schliessen"></button>
</header> </header>
<main class="lm-buehne"> <main ref="buehne" class="lm-buehne">
<section v-if="screen.typ === 'intro'" class="lm-screen lm-intro"> <section v-if="screen.typ === 'intro'" class="lm-screen lm-intro">
<div class="lm-kapnr">Kapitel {{ screen.nr }} / {{ screen.von }}</div> <div class="lm-kapnr">Kapitel {{ screen.nr }} / {{ screen.von }}</div>
<h1>{{ screen.kap.titel }}</h1> <h1>{{ screen.kap.titel }}</h1>

View File

@@ -302,7 +302,8 @@ table.kennzahlen th { color: var(--dim); }
background: var(--karte); color: var(--text); cursor: pointer; font-size: 14px; background: var(--karte); color: var(--text); cursor: pointer; font-size: 14px;
} }
.lm-fuss button:disabled { opacity: 0.4; cursor: default; } .lm-fuss button:disabled { opacity: 0.4; cursor: default; }
.lm-buehne { flex: 1; overflow-y: auto; } /* Block-Scroll: Padding am Ende bleibt erhalten */ .lm-buehne { flex: 1; overflow-y: auto; scrollbar-width: none; } /* Block-Scroll: Padding am Ende bleibt erhalten */
.lm-buehne::-webkit-scrollbar { display: none; } /* Scrollbalken unsichtbar, Scrollen bleibt */
.lm-screen { .lm-screen {
width: 100%; max-width: 760px; margin: 0 auto; padding: 40px 24px 96px; width: 100%; max-width: 760px; margin: 0 auto; padding: 40px 24px 96px;
font-family: 'Inter Variable', system-ui, sans-serif; /* Lesetypografie wie im Guide */ font-family: 'Inter Variable', system-ui, sans-serif; /* Lesetypografie wie im Guide */