${PHASEN[ph].label}
`; @@ -887,8 +907,9 @@ function renderList(){ } $("#stationList").innerHTML = html; $("#stationList").querySelectorAll(".stationItem").forEach(el=>{ - el.onclick = ()=>{ enterStation(+el.dataset.i); save(); draw(); }; + el.onclick = ()=>{ document.body.classList.remove("navOpen"); enterStation(+el.dataset.i); save(); draw(); }; }); + const nc = $("#navClose"); if(nc) nc.onclick = ()=> document.body.classList.remove("navOpen"); const pct = Math.round(Object.keys(S.done).length / STATIONEN.length * 100); $("#progressBar").style.width = pct+"%"; } @@ -896,6 +917,7 @@ function renderList(){ /* ====================== VIEW DISPATCH ====================== */ function draw(){ document.body.classList.toggle("runMode", S.view==="run"); + if(S.view!=="run") document.body.classList.remove("navOpen"); renderCardBadge(); if(S.view==="deck") return renderDeck(); if(S.view==="classify") return renderClassify(); @@ -949,11 +971,15 @@ function renderClassify(){ ? `Nicht ganz — überlegt nochmal und probiert es erneut.
` : ``;
$("#panel").innerHTML = `
Schritt 2 · Change-Art bestimmen
- ${thumb}
- Welche Art von Change ist das?
-Überlegt gemeinsam und wählt die passende Change-Art. Die Legende hilft beim Einordnen.
- ${hint} -${choices}
+
+ 
+
${legend}
`;
$("#panel").querySelectorAll(".choice").forEach(el=>{
@@ -1204,6 +1230,8 @@ function renderEnd(){
/* ====================== INIT ====================== */
(function init(){
$("#resetBtn").onclick = ()=>{ if(confirm("Neue Action Card ziehen und Durchlauf zurücksetzen?")){ S=defaultState(); save(); draw(); } };
+ $("#stationsBtn").onclick = ()=> document.body.classList.toggle("navOpen");
+ $("#navBackdrop").onclick = ()=> document.body.classList.remove("navOpen");
draw();
})();
+
+
+ Welche Art von Change ist das?
+Überlegt gemeinsam und wählt die passende Change-Art. Die Legende hilft beim Einordnen.
+ ${hint} +${choices}
+