📖 Formatierung – Spickzettel¶

Alle Gestaltungsmittel von Material for MkDocs, mit je einem Beispiel. Links der gerenderte Effekt, im Quelltext darunter die Syntax. Diese Seite ist zugleich der Testfall: Rendert hier etwas nicht, ist beim Umbau etwas kaputtgegangen.

Admonitions¶

Notiz

Normale Hinweisbox.

Tipp

Kurzer Kniff.

Achtung

Hier kann etwas schiefgehen.

Gefahr

Das kann Daten kosten.

Zugeklappt (Standard)

Mit ??? ist die Box zu, mit ???+ offen.

Offen

Aufgeklappt beim Laden.

Beispiel

Auch quote, bug, failure, question, abstract gibt es.

!!! warning "Achtung"
    Eingerückter Inhalt.

??? info "Zugeklappt"
    Inhalt.

Annotations¶

Text mit Anmerkung (1) und noch einer (2).

Erste Anmerkung, erscheint beim Klick auf das Plus.
Zweite Anmerkung, auch mit Markdown.

server:
  port: 8080 # (1)!
  host: 0.0.0.0 # (2)!

Der Port des Dienstes.
Auf allen Interfaces lauschen.

Buttons¶

Primär Sekundär Mit Icon

[Primär](link){ .md-button .md-button--primary }
[:material-github: Mit Icon](link){ .md-button }

Code blocks¶

Inline code, mit Highlight print("hi"), und ein Block mit Titel, Zeilennummern und markierten Zeilen:

beispiel.py
def gruss(name):
    return f"Hallo {name}"   # diese Zeile ist markiert

print(gruss("Welt"))

docker compose up -d
docker logs -f sonarr

Tastenkürzel: Ctrl+Alt+Del, Cmd+K.

Content tabs¶

DockerProxmoxManuell

docker compose up -d

Per Web-Oberfläche: Create CT, Template wählen.

Direkt auf dem Host installieren.

=== "Tab 1"

    Inhalt (4 Leerzeichen eingerückt)

Data tables¶

Tabellen lassen sich durch Klick auf die Kopfzeile sortieren.

Dienst	Port	Typ
Sonarr	8989	Serien
Radarr	7878	Filme
Prowlarr	9696	Indexer
Lidarr	8686	Musik

Diagrams¶

graph LR
  A[GitHub-Repo] --> B[sync.py]
  B --> C[MkDocs-Build]
  C --> D[Cloudflare Worker]
  D --> E[docs.deleven.net]
  D --> F[Interne Seite]

sequenceDiagram
  Browser->>Cloudflare: Anfrage
  Cloudflare-->>Browser: Login (Access)
  Browser->>Cloudflare: eingeloggt
  Cloudflare-->>Browser: Seite

Footnotes¶

Eine Aussage mit Fussnote¹ und eine zweite².

Formatting¶

Normal, fett, kursiv, beides, ~~durchgestrichen~~, markiert, unterstrichen, H₂O, A², Ctrl+S.

Zitat als Blockquote.

Grids¶

Server

Proxmox, Docker, NAS.
Medien

Sonarr, Radarr, Plex.
Zugang

Cloudflare Access und Tunnel.
Notizen

Ideen und To-dos.

Icons, Emojis¶

Icon-Suche: https://squidfunk.github.io/mkdocs-material/reference/icons-emojis/#search

:material-home: :fontawesome-brands-github: :rocket:

Images¶

Bild mit Beschriftung, Klick vergrössert:

Das Logo (Klick zum Vergrössern)

![Alt](bild.png){ width="300" align=right loading=lazy }

Lists¶

Ungeordnet
- verschachtelt
Noch ein Punkt
Geordnet
Zweiter Punkt
1. Unterpunkt
Erledigt
Offen

Definitionsliste: Begriff und Erklärung dazu.

Math¶

Inline: \(E = mc^2\)

Block:

\[ \int_0^\infty e^{-x^2}\,dx = \frac{\sqrt{\pi}}{2} \]

Tooltips¶

Mit Tooltip auf Link und Abkürzungen: Das HTML-Format, der Zugriff per API, im LAN oder per DNS.

Die Fussnote steht am Seitenende, mit Tooltip beim Darüberfahren. ↩
Noch eine. ↩