Glossar

Statisches Glossar mit Live-Suche und Light/Dark Mode. Jeder Begriff liegt in einer eigenen .bib-Datei. Der Build-Prozess kombiniert alle Einträge zu einer einzigen, serverseitig komplett passiven index.html.

Projektstruktur

entries/        ← je eine .bib-Datei pro Begriff
config/style.config.json ← Farb- und Schriftkonfiguration für die Website
build.js        ← Build-Skript (kein npm install nötig)
Makefile
.gitlab-ci.yml  ← automatisches Deployment via GitLab Pages

Konfiguration von Farben und Schriftarten

Die Datei config/style.config.json steuert nur die Hintergrundfarbe des Headers.

Einstellungen:

• colors.light.headerBg — Header-Hintergrundfarbe für den Light-Mode.
• colors.dark.headerBg — Header-Hintergrundfarbe für den Dark-Mode.

Die Schriftgrößen, Schriftarten und alle anderen Farben außer dem Header-Hintergrund sind fest im Build-Skript definiert und können hier nicht geändert werden.

Standardwerte:

• colors.light.headerBg: #1e3a5f
• colors.dark.headerBg: #010409

Optional kannst du zusätzlich die Quell-Repository-URL angeben. Diese URL wird im Header und im Footer der erzeugten Seite angezeigt und wird als HTTP(S)-Link ausgegeben.

Beispiel:

{
  "colors": {
    "light": {
      "headerBg": "#1e3a5f"
    },
    "dark": {
      "headerBg": "#010409"
    }
  },
  "repository": {
    "url": "https://gitlab.com/dein/projekt"
  }
}

Wenn repository.url fehlt, versucht das Build-Skript automatisch, die Remote-URL von Git (origin) zu verwenden. Dabei werden etwaige Ports aus der erkannten URL entfernt.

Neuen Begriff anlegen

Neue Datei unter entries/mein_begriff.bib erstellen:

@glossary{eindeutiger_schluessel,
  Begriff             = {Vollständiger Begriffsname},
  Abkuerzung          = {ABK},
  Erklaerung          = {Ausführliche Beschreibung des Begriffs.
    
    Zeilenumbrüche werden unterstützt.
    Links im Markdown-Format: [Linktext](https://example.com)},
  Unternehmensbereich = {IT},
  Status              = {aktiv}
}

Mögliche Status-Werte: aktiv · inaktiv · veraltet · In Bearbeitung

Der Dateiname spielt keine Rolle — alle .bib-Dateien in entries/ werden beim Build alphabetisch eingelesen.

Formatierung in der Erklärung

Im Feld Erklaerung werden folgende Formatierungen unterstützt:

• Zeilenumbrüche: Verwende reguläre Zeilenumbrüche (Enter im Editor) — diese werden als <br> dargestellt.
• Links: Verwende das Markdown-Format [Linktext](https://example.com) — diese werden als klickbare Links mit target="_blank" dargestellt.

Funktionen der Webseite

• Live-Suche — filtert beim Tippen; Treffer im Feld „Begriff" werden priorisiert oben angezeigt
• Bereichsfilter — Klick auf einen Unternehmensbereich in der Tabelle setzt einen aktiven Filter-Chip
• Statusfilter — Klick auf ein Status-Badge setzt einen zweiten Filter-Chip
• Beide Filter lassen sich gleichzeitig mit der Textsuche kombinieren (AND-Logik) und per × entfernen
• Light / Dark Mode — Toggle-Button im Header; übernimmt beim ersten Besuch das System-Farbschema, speichert die Wahl danach im Browser

Lokal bauen und vorschauen

make          # baut public/index.html
make preview  # baut und startet Vorschau auf http://localhost:8080
make clean    # löscht public/

Voraussetzung: Node.js ≥ 26 und Python 3 (für make preview).

Deployment via GitLab

Der Job pages in .gitlab-ci.yml wird automatisch ausgelöst, sobald auf den Default-Branch gepusht wird. GitLab stellt die fertige public/index.html dann über GitLab Pages bereit.

Das public/-Verzeichnis wird ausschließlich durch die CI generiert und ist in .gitignore eingetragen.

Lizenz

MIT