update

frontend/src/components/Board.vue

@@ -41,7 +41,6 @@ const EBENEN = [
   { key: 'inventar', titel: 'Atome' },
   { key: 'artefakte', titel: 'Artefakte' },
   { key: 'struktur', titel: 'Bausteine' },
-  { key: 'diagramme', titel: 'Diagramme' },
   { key: 'guide', titel: 'Guide' },
 ]
 
@@ -80,10 +79,6 @@ function karten(key) {
     return s.bausteine.map((b) => ({ id: b.id, text: `${b.ord + 1}. ${b.titel}`,
       badges: [[b.status, statusFarbe(b.status)]] }))
   }
-  if (key === 'diagramme') {
-    return (s.diagramme || []).map((d) => ({ id: d.id, text: `${d.ord + 1}. ${d.titel}`,
-      badges: [[d.status, statusFarbe(d.status)], [`${d.typ} · ${d.quelle}`, 'blau']] }))
-  }
   return s.bausteine.map((b) => ({ id: b.id, text: `${b.ord + 1}. ${b.titel}`,
     badges: [[b.stage || 'offen', b.stage === 'done' ? 'gruen' : 'blau']] }))
 }

frontend/src/components/Guide.vue

@@ -1,14 +1,8 @@
 <script setup>
 import { computed, nextTick, onUnmounted, ref, watch } from 'vue'
-import mermaid from 'mermaid'
 import { api } from '../api.js'
 import { render, lesestat } from '../markdown.js'
 
-// securityLevel:'strict' → kein foreignObject/HTML-Label (umgeht DOMPurify-Filter),
-// keine Klick-Handler. startOnLoad:false → wir rendern selbst nach jedem Einblenden.
-mermaid.initialize({ startOnLoad: false, securityLevel: 'strict', theme: 'neutral' })
-let mmId = 0
-
 const props = defineProps({ topic: String, state: Object })
 const daten = ref(null)
 const level = ref('E') // Durchgang-Wahl: jede Stufe ist ein eigener Lese-Durchgang
@@ -46,27 +40,6 @@ function html(s) {
   return htmlCache.get(key)
 }
 
-// Mermaid rendert asynchron ins DOM — nach jedem Einblenden (Scroll/Level/Ansicht)
-// die noch nicht verarbeiteten ```mermaid-Blöcke im sichtbaren Bereich rendern.
-async function renderMermaid() {
-  await nextTick()
-  const wurzel = scrollEl.value
-  if (!wurzel) return
-  for (const code of wurzel.querySelectorAll('code.language-mermaid:not([data-mm])')) {
-    code.setAttribute('data-mm', '1')
-    const pre = code.closest('pre')
-    try {
-      const { svg } = await mermaid.render(`mm-${mmId++}`, code.textContent)
-      const figur = document.createElement('div')
-      figur.className = 'mermaid-figur'
-      figur.innerHTML = svg
-      pre?.replaceWith(figur)
-    } catch {
-      pre?.classList.add('mermaid-fehler')  // kaputt: als Codeblock stehen lassen
-    }
-  }
-}
-watch([aktiv, ansicht, level, daten], renderMermaid, { flush: 'post' })
 
 // Nur aktives Kapitel ±1 im DOM; der Rest ist ein Platzhalter mit Schätzhöhe
 const sichtbar = (i) => Math.abs(i - aktiv.value) <= 1