# Mermaid-Diagramme im eigenen Markdown rendern

## Worum es geht

Diagramme (Produktionsketten, Abläufe, Zustandsgraphen) sollen auf den eigenen
Seiten erscheinen — nicht nur als Bild, sondern als Text, der mit dem Rest
mitläuft und diffbar bleibt.

Gitea 1.26.4 rendert Mermaid bereits, die Spiel-Doku braucht also nichts.
Was fehlt, ist der Weg nach draußen: auf den Hub, ins Devlog, auf eine
öffentliche Seite. Das kann kein externes Werkzeug übernehmen.

**Ausdrücklich nicht Teil davon:** ein eigener Editor. mermaid.live ist vom
selben Team, MIT-lizenziert, kostenlos und ohne Konto. Ihn nachzubauen bringt
nichts außer Wartung. Geschrieben wird dort, gerendert wird hier.

## Was zu tun ist

1. **Code-Blöcke im Mini-Markdown.** `frontend/src/markdown.jsx` kennt heute
   nur `` `inline code` `` — eingezäunte Blöcke (` ``` `) gar nicht. Das ist die
   Voraussetzung für alles Weitere und für sich schon eine Lücke.
2. **```mermaid abzweigen** und an einen eigenen Renderer geben.
3. **Bibliothek per `import()` nachladen.** Mermaid ist als npm-Paket 83 MB
   entpackt; im Browser landet weniger, es bliebe aber der größte Brocken. Das
   Frontend ist im Ganzen gerade ~540 kB — das darf nur zahlen, wer eine Seite
   mit Diagramm öffnet.
4. **Fehlerfall bedenken:** kaputte Syntax darf die Seite nicht killen, sondern
   zeigt den Quelltext als Code-Block.
5. **Beide Themes.** Mermaid bringt eigene Farben mit; die müssen an die
   CSS-Variablen der Seite.

## Wo es wirkt

`markdown.jsx` hängt an neun Stellen: Changelog, DevlogDetail, Devlogs, Events,
Home, Roadmap, Seite (freier Seiten-Editor), Settings und dem Composer-Vorschau.
Der eigentliche Anwendungsfall ist der **Seiten-Editor** — dort entsteht der
Text, in dem ein Diagramm Sinn ergibt.

## Aufwand

Ein Nachmittag. Kein Projekt.

## Offen

Lohnt sich das Megabyte? Nur, wenn Diagramme wirklich auf öffentliche Seiten
sollen. Reine Eigen-Doku ist mit Gitea schon abgedeckt.