Ich habe gerade ein Theme veröffentlicht, an dem ich eine Weile gearbeitet habe. Es ist jetzt Open Source unter der MIT-Lizenz verfügbar: Ein sauberes, modernes Design, das um halbtransparente, mattierte Glasflächen (Header, Sidebar, Suche) aufgebaut ist, mit einem eigens entwickelten Farbkonzept für den hellen und dunklen Modus – keine hartkodierten Farben, alles an die CSS-Custom-Properties von Discourse gekoppelt, sodass es sofort funktioniert und automatisch zwischen hellem und dunklem Modus wechselt.
Repo: GitHub - terraboss/discourse-terraglass · GitHub
Funktionen
- Mattierte Glasflächen – Header, Sidebar/Hamburger-Menü und das Suchfeld/Dropdown im Header sind halbtransparent, mit Hintergrund-Unschärfe (Backdrop Blur); sowohl Opazität als auch Unschärfestärke sind konfigurierbar
- Getrennte, eigens entwickelte Farbkonzepte für den hellen und dunklen Modus (nicht einfach nur ein invertiertes Schema), geprüft auf WCAG-AA-Kontrast für Text und UI-Elemente
- Link-Vorschauen im X/Twitter-Stil (Onebox) mit feiner Rahmenlinie und abgerundeten Ecken
- Etiketten im Stil von Flaggen/Pfeilen
- Feste 16:9-Video-Einbettungen auf allen Geräten
- Gestreifte Themenliste (Zebra-Striping) mit dezentem Hover-Effekt
- Konfigurierbare Eckenabrundung für Buttons, Karten, Modale und Eingabefelder
- Barrierefreier Fokus-Rahmen, der die eigene Textfarbe des jeweiligen Farbkonzepts verwendet, sodass er sowohl im hellen als auch im dunklen Modus sichtbar bleibt
- Alles oben Genannte ist eine Theme-Einstellung – deaktiviere oder passe an, was du nicht möchtest
Installation
Anpassen → Themes → Installieren → Aus einem Git-Repository:
https://github.com/terraboss/discourse-terraglass
Damit hast du auch künftig die Möglichkeit, mit einem Klick nach Updates zu suchen.
Bekanntes Problem
backdrop-filter (die Unschärfe hinter der Sidebar, dem Hamburger-Menü und dem Suchpanel) wird in jeder Browser-/Discourse-Kombination nicht korrekt gerendert, obwohl die Transparenz selbst zuverlässig funktioniert und für sich genommen angemessen zurückfällt. Ich verfolge das hier: backdrop-filter blur has no effect on .menu-panel – falls jemand auf dieses Problem gestoßen ist oder Ideen hat, freue ich mich über Rückmeldungen.
Feedback ist willkommen, ich nehme gerne Feature-Wünsche oder Bug-Reports im Repo entgegen.