Portal-Dienste und geteiltes Design-System für die anderen Apps

- Dienste (Gitea, Kanban, Cloud …) werden im System-Tab gepflegt und
  erscheinen als Kacheln auf der Startseite; GET /api/services ist
  öffentlich, Pflege braucht den settings-Scope
- /brand.css liefert die Design-Tokens (Farben live aus dem Brand-Tab,
  ändern sich damit überall mit) plus Basis-Klassen d4rk-card,
  d4rk-btn, d4rk-title, d4rk-tag
- /brand-nav.js baut die D4RKST3R-Leiste in jede fremde App ein, mit
  Links zum Hub und zu allen gepflegten Diensten; die Links stecken
  fertig im Skript, dadurch kein zweiter Request und kein CORS nötig
- Beide Dateien mit offenem CORS-Header und 5 Minuten Cache
- Doku für Anbindung + Schriften in docs/sso.md ergänzt

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
2026-07-31 13:28:50 +02:00
co-authored by Claude Fable 5
parent 70cae85064
commit c73b4e1074
9 changed files with 350 additions and 1 deletions
+26 -1
View File
@@ -101,7 +101,32 @@ app.get('/auth/callback', async (req, res) => {
});
```
## 5. Hinweise
## 5. Aussehen mitnehmen (Design-System)
Damit die angebundene App nicht wie ein Fremdkörper wirkt, liefert der Bot die
Brand-Tokens und eine fertige Navigation aus:
```html
<link rel="stylesheet" href="https://bot.d4rkst3r.de/brand.css">
<script defer src="https://bot.d4rkst3r.de/brand-nav.js"></script>
```
* **`/brand.css`** — CSS-Variablen (`--neon`, `--bg`, `--display` …) plus ein paar
Basis-Klassen: `.d4rk-card`, `.d4rk-btn`, `.d4rk-title`, `.d4rk-tag`.
Die Farben kommen live aus dem Brand-Tab — änderst du sie dort, ändern sie sich
überall mit (Cache: 5 Minuten).
* **`/brand-nav.js`** — fügt oben die D4RKST3R-Leiste ein, mit Links zurück zum Hub
und zu allen im Setup gepflegten Diensten. Die Links stecken fertig im Skript,
es sind also keine weiteren Anfragen und kein CORS nötig.
Die Schriften installierst du in der App selbst, damit sie lokal ausgeliefert werden
(kein Google-Fonts-Aufruf):
```bash
npm i @fontsource/bebas-neue @fontsource/barlow-condensed @fontsource/share-tech-mono
```
## 6. Hinweise
* Der Verify-Aufruf muss **serverseitig** erfolgen — das Secret darf nie im Browser landen.
* Nur Mitglieder des konfigurierten Discord-Servers können sich anmelden; alle anderen