From 45e4a2ea74a5564d8542bde7085fe685b6f3bfce Mon Sep 17 00:00:00 2001 From: breitenbach76 Date: Sat, 6 Jun 2026 16:45:43 +0200 Subject: [PATCH] . --- 04_Tablet-Quiz/app/index.html | 109 ++++++++++++++++++---------------- 1 file changed, 58 insertions(+), 51 deletions(-) diff --git a/04_Tablet-Quiz/app/index.html b/04_Tablet-Quiz/app/index.html index 0d16287..37ddde0 100644 --- a/04_Tablet-Quiz/app/index.html +++ b/04_Tablet-Quiz/app/index.html @@ -116,6 +116,23 @@ .pfad { border:1px solid var(--line); border-left:4px solid var(--transition); border-radius:8px; padding:10px 12px; } .pfad b { display:block; } + /* ---- Minimal Run-Screens ---- */ + .sHead{display:flex;align-items:center;gap:10px} + .sHead .sId{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums} + .sTitle{font-size:22px;font-weight:700;line-height:1.25;margin:10px 0 4px} + .caseLine{color:var(--muted);font-size:13px;margin:0 0 22px} + .lead{font-size:16px;margin:0 0 16px} + .todo{margin:0 0 8px;padding-left:22px} + .todo li{margin:8px 0} + .crit{margin:8px 0 0;padding-left:20px;color:var(--muted)} + .crit li{margin:4px 0} + details.det{margin:8px 0 4px;border-top:1px solid var(--line);padding-top:12px} + details.det>summary{cursor:pointer;color:var(--muted);font-size:14px;font-weight:600;list-style:none} + details.det>summary::-webkit-details-marker{display:none} + details.det>summary::before{content:"▸ ";color:var(--muted)} + details.det[open]>summary::before{content:"▾ "} + details.det>div,details.det>p,details.det>ul{margin-top:10px} + .actions { display:flex; gap:10px; align-items:center; margin-top:24px; flex-wrap:wrap; } .actions .spacer { flex:1; } .unclear { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:14px; } @@ -1052,13 +1069,9 @@ function renderRun(){ : ``; let body = ` ${loopBanner} - ${chip} -
${st.name}
-
${st.id}
-
Action Card: ${USE_CASES[S.service].service} - ${CHANGE_TYPES[S.change]} -
${acard(S.service,S.change).titel} — ${acard(S.service,S.change).text}
-
`; +
${chip}${st.id}
+

${st.name}

+
Fall: «${acard(S.service,S.change).titel}»
`; if(st.typ==="gate") body += (S.stage==="gateDone") ? renderGateDone(st) : renderGate(st); else body += (S.stage==="reveal") ? renderReveal(st) : renderAct(st); $("#panel").innerHTML = body; @@ -1068,46 +1081,39 @@ function renderRun(){ /* Aktivitaet — Takt 1: Handeln am Brett (mit "Zeig mir") */ function renderAct(st){ return ` -
-
1 Handeln am Brett
-
- Besprecht und legt am Brett ab: -
    -
  • 1 · Wer ist beteiligt? Die Figuren der beteiligten Rollen auf die Mulden des Station-Pucks stellen.
    • -
  • 2 · Wie ist die RACI? Dieselben Figuren ins Aktiv-Feld (R · A · C · I) einsortieren.
    • -
  • Was passiert? Kurz klären, was hier für euren Change getan wird.
    • -
  • Artefakt? Passende Artefaktkarte in die Service-Akte legen (oder Status weiterschieben).
    • -
-
- Zeig mir (wenn ihr nicht weiterkommt) -
${raciTable(st)}

Artefakt: ${st.artefakt}

-
-
-
-
-
- -
`; +

Handeln am Brett — besprecht und legt ab:

+
    +
  1. Beteiligte Rollen → Figuren auf die Mulden des Station-Pucks
    2. +
  2. RACI klären → dieselben Figuren ins Aktiv-Feld (R·A·C·I)
    3. +
  3. Artefaktkarte → in die Service-Akte
    4. +
+
+ Zeig mir +
${raciTable(st)}

Artefakt: ${st.artefakt}

+
+
+
+ +
`; } /* Aktivitaet — Takt 2: Aufloesung & Abgleich */ function renderReveal(st){ return ` -
-
2 Auflösung & Abgleich
-

${st.beschreibung}

-

Umfasst

-

Rollen / RACI

${raciTable(st)} -

Artefakt

${st.artefakt}

-

Gleicht euer Brett ab — Figuren/Artefakt korrigieren, falls nötig.

-
-
- -
- ${S.index < STATIONEN.length-1 - ? `` - : ``} -
`; +

Auflösung — gleicht euer Brett ab:

+ ${raciTable(st)} +

Artefakt: ${st.artefakt}

+
+ Worum geht's & was umfasst die Station +

${st.beschreibung}

    ${st.umfasst.map(u=>`
  • ${u}
    • `).join("")}
+
+
+ +
+ ${S.index < STATIONEN.length-1 + ? `` + : ``} +
`; } /* Gate — Entscheidung nach Kriterien */ @@ -1117,18 +1123,19 @@ function renderGate(st){ const opts = (st.pfade||[]).map(([n,d],i)=> ``).join(""); const revisitNote = (S.revisit && S.revisit[st.id]) - ? `
↩ Erneute Vorlage nach Nacharbeit — prüft die Kriterien erneut und entscheidet neu.
` : ``; + ? `
↩ Erneute Vorlage nach Nacharbeit — prüft erneut und entscheidet neu.
` : ``; return ` -
-
⛩ Gate-Entscheidung
-

${st.beschreibung}

${revisitNote} -

Entscheidet: ${roleLabel(keeper)}

-

Prüft am Brett (Kriterien)

- -

Liegen die geforderten Artefaktkarten in der Service-Akte? Stehen die Pflicht-Figuren am Gate-Puck? Dann entscheidet:

+

Entscheidet: ${roleLabel(keeper)}

${opts}
-
`; +
+ Worum geht's & Prüf-Kriterien +
+

${st.beschreibung}

+
    ${pruef}
+

Artefaktkarten in der Akte? Pflicht-Figuren am Gate-Puck?

+
+
`; } /* Gate — Konsequenz der Entscheidung */