Funktionsübersicht

Rendering#

Markdown-Syntax#

Zusätzlich zu CommonMark und GitHub Flavored Markdown werden diese Erweiterungen unterstützt:

Mathematik#

Gerendert mit KaTeX , das deutlich schneller als MathJax ist.

• Im Text: $E = mc^2$ oder \(E = mc^2\)
• Abgesetzt: $$…$$ oder \[…\]
• Matrizen, mehrzeilige aligned-Ausrichtung, abschnittsweise definierte Funktionen mit cases, Summen und Integrale, griechische Buchstaben und Symbole aus gängigen Paketen

Der Reader behandelt das Zeichen $ vorsichtig, sodass Preise wie $100 und $5 - $10 nicht für Formeln gehalten werden.

Diagramme#

Gerendert mit Mermaid : Schreibe sie einfach in einen ```mermaid-Codeblock. Unterstützt werden Fluss-, Sequenz-, Klassen-, Zustands-, ER-, Gantt-, Kreis-, User-Journey-, Mindmap-, Git-Graph-, Quadranten- und Timeline-Diagramme.

Die Diagrammfarben sind an die Variablen des Website-Farbschemas gebunden. Beim Wechsel in den Dunkelmodus werden sie mit passenden Farben neu gerendert. Fahre über ein Diagramm, um den Quelltext zu kopieren oder oben rechts das SVG herunterzuladen.

Syntaxhervorhebung#

• Chroma hebt serverseitig hervor (Dokumentationsseiten), highlight.js clientseitig (Reader). Beide verwenden dieselben Farbvariablen und sehen daher identisch aus
• Jeder Codeblock bietet Sprachbezeichnung, Kopierschaltfläche, Zeilennummern und weichen Umbruch
• Blöcke mit mehr als 24 Zeilen werden automatisch eingeklappt; zum Aufklappen klicken
• Mit title kann ein Dateiname angegeben werden:

1
2
3

```js {title="app.js"}
const a = 1;
```

Hinweisblöcke#

Beide Schreibweisen funktionieren. GitHub-Stil (in dieser Dokumentation und im Reader verfügbar):

1
2
3
4
5
6
7
8

> [!NOTE]
> Eine allgemeine Anmerkung

> [!TIP]
> Ein praktischer Tipp

> [!WARNING]
> Etwas, das Aufmerksamkeit erfordert

Container-Stil (nur im Reader; die Dokumentationsseiten verarbeiten ihn nicht):

1
2
3

::: tip Eigener Titel
Die Container-Syntax unterstützt note / tip / important / warning / caution / danger / details
:::

Sechs Typen: NOTE TIP IMPORTANT WARNING CAUTION DANGER.

Front Matter#

YAML (---), TOML (+++) und JSON ({}) werden erkannt. title, description, date, author, tags und categories erscheinen im Dokumentkopf; alle übrigen Angaben werden in einer einklappbaren „Front Matter“-Karte gesammelt.

Lesekomfort#

Farbschemata#

• Hell, dunkel und Systemeinstellung; mit D wechseln
• Ein Inline-Skript setzt das Farbschema vor dem ersten Zeichnen, sodass kein weißes Aufblitzen entsteht
• Im Dunkelmodus passen sich Code-, Diagramm- und Formelfarben gemeinsam an

Typografie#

Drücke ,, um die Einstellungen zu öffnen:

Die Einstellungen liegen im localStorage des Browsers und bleiben über Seiten und Sitzungen hinweg erhalten.

Navigation#

• Dateibaum: einklappbare Verzeichnisse mit sofortiger Filterung nach Dateinamen
• Gliederung: Ebenen 2 bis 4; IntersectionObserver hebt beim Scrollen den aktuellen Abschnitt hervor und führt die Gliederung mit
• Lesefortschritt: ein Verlaufsbalken am oberen Rand und nach 600 px eine Schaltfläche nach oben
• Positionsspeicher: Die Scrollposition jedes Dokuments wird als Verhältnis gespeichert und bei der Rückkehr wiederhergestellt
• Zurück / weiter: J und K wechseln durch die Dateiliste

Bilder#

Zum Öffnen der Bildansicht klicken: mit dem Mausrad zoomen, durch Ziehen verschieben, per Doppelklick zwischen 1×/2× wechseln, mit + - 0 steuern oder direkt herunterladen.

Suche#

Dateiübergreifende Suche im Reader#

Drücke / oder Ctrl+K. Nach dem Laden eines Ordners wird jede Markdown-Datei im Hintergrund gelesen und mit Fuse.js ein fehlertoleranter Index erstellt. Die Gewichtung lautet Titel > Dateiname > Text > Pfad. Ergebnisse zeigen Dateipfad und hervorgehobenen Kontext; Pfeiltasten wählen aus, Enter öffnet.

Im Dokument suchen#

Drücke F oder Ctrl+F, um Treffer im aktuellen Dokument einzeln hervorzuheben. Enter springt zum nächsten, Shift+Enter zum vorherigen Treffer; ein Zähler zeigt „n von m“.

Websiteweite Suche#

Die Dokumentationsseiten werden vorab indexiert. Das Suchfeld fragt diesen Index vollständig im Browser ab – ohne Backend-Anfrage.

Bearbeiten#

Drücke M, um den Bearbeitungsmodus zu öffnen: links Markdown-Quelltext, rechts eine Live-Vorschau (mit 260 ms Verzögerung), getrennt durch eine verschiebbare Trennlinie, deren Position gespeichert wird.

• Werkzeugleiste: Überschriften, fett, kursiv, durchgestrichen, Inline-Code, drei Listenarten, Blockzitat, Link, Bild, Tabelle, Codeblock, Formel, Mermaid, Hinweisblock und horizontale Linie. Erneut klicken, um eine bereits angewandte Formatierung zu entfernen
• Tastatur: Ctrl+B/I/K für fett, kursiv und Link; Tab rückt eine mehrzeilige Auswahl ein; Enter setzt eine Liste fort, erhöht die Nummer und beendet sie bei einem leeren Eintrag. Alle Operationen verwenden execCommand, sodass der native Rückgängig-Verlauf des Browsers funktioniert
• Speichern: Ctrl+S schreibt in die lokale Originaldatei. Beim ersten Speichern fragt der Browser nach Berechtigung und erweitert den bisherigen Lesezugriff auf Lesen und Schreiben
• Entwürfe: Nach 1,2 s Inaktivität wird der Inhalt in IndexedDB gespeichert. Beim Dateiwechsel sowie beim Schließen des Arbeitsbereichs oder der Seite wird bei ungespeicherten Änderungen nachgefragt; beim nächsten Öffnen wird die Wiederherstellung angeboten
• Mermaid-Cache: Die Vorschau speichert gerenderte Diagramme anhand ihres Quelltexts, damit sie beim Tippen nicht ständig neu gezeichnet werden

Export#

Beim PDF-Export lassen sich Papierformat (A4 / Letter / A5), Ausrichtung, Ränder, Textskalierung, Titelseite, anklickbares Inhaltsverzeichnis, Seitenumbruch bei H1 oder H2, Codeumbruch und Ausgabe externer Link-URLs einstellen. Im Dunkelmodus werden Mermaid-Diagramme vorübergehend mit hellen Farben neu gerendert, damit kein blasser Text auf dunklem Hintergrund gedruckt wird.

Technische Funktionsweise#

Abhängigkeiten und Größe#

Alle Abhängigkeiten werden während des Builds in die Ausgabe gebündelt. Zur Laufzeit wird kein Drittanbieter-CDN kontaktiert. Die Website kann vollständig offline bereitgestellt werden und keine externe Ressource kann blockiert werden.

Datenschutz#

• Dateien werden ausschließlich im Browser gelesen und geschrieben; nichts wird hochgeladen
• Keine Drittanbieterskripte, keine Analyse, kein Tracking, keine Cookies
• Einstellungen liegen in localStorage; Verzeichnishandles, Lesepositionen und Entwürfe in IndexedDB – alles auf deinem Computer

Sprachen#

Die Oberfläche ist auf Englisch, vereinfachtem Chinesisch, traditionellem Chinesisch, Japanisch, Spanisch, Französisch, Italienisch und Deutsch verfügbar. Englisch liegt im Stammverzeichnis; die anderen Sprachen befinden sich unter /zh/, /zh-hant/, /ja/, /es/, /fr/, /it/ und /de/, jeweils mit einer eigenen teilbaren URL. Über das Globussymbol in der Kopfzeile kann jederzeit gewechselt werden; wenn vorhanden, öffnet es die entsprechende Übersetzung der aktuellen Seite.

Oberflächentexte liegen in data/i18n/<lang>.toml und werden von Templates und Browserskripten gemeinsam verwendet; jede Seite lädt nur die Texte ihrer eigenen Sprache. Unterscheidet sich beim ersten Besuch die Browsersprache von der Seite, erscheint unten ein dauerhaft ausblendbarer Wechselhinweis.

Verwandte Themen#

• Markdown-Syntaxbeispiele
• Tastenkürzel