Wir haben gerade eine zweite Iteration unseres Theme-Redesigns veröffentlicht. Während das erste Update ein visuelles Refresh war, das auf dem bisherigen Meta Branded Theme aufbaute, ist diese Version im Wesentlichen ein komplett neu erstelltes Theme. Die neue Marken-Sprache wurde bereits mit dem vorherigen Release eingeführt, daher gibt es in dieser Hinsicht nicht allzu viele sichtbare Änderungen. Was sich mit diesem Update erheblich geändert hat, ist die Implementierung des Themes selbst sowie der Eindruck, den sie davon vermittelt, wohin wir uns bei der Discourse-Anpassung im Allgemeinen bewegen.
Ich gehe nun auf einige Implementierungsdetails ein, beginnend mit den kleineren Punkten:
Lucide Icons
Lucide ist ein Open-Source-Set moderner Strich-Icons, das wir bereits in mehreren unserer Anpassungsprojekte eingeführt haben. Mit dieser Iteration haben wir es nun auch in das Meta Branded Theme integriert. Es sind keine Pläne vorhanden, Font Awesome im Discourse-Kern zu ersetzen, doch die kostenlose Stufe von Font Awesome bietet nur eine begrenzte Auswahl an Strich-Icons, die nicht ausreicht, um ein kohärentes Strich-Icon-System zu bilden. Das Theme-Komponenten-Modul ist unter Discourse Lucide Icons verfügbar.
Theme-Modifikator zur Einschränkung der Farbpaletten
Wir haben einen neuen Theme-Modifikator namens only_theme_color_schemes hinzugefügt, der festlegt, welche Farbpaletten für ein bestimmtes Theme verfügbar sind – sowohl für Administratoren als auch für Benutzer in ihren Interface-Einstellungen. Meta verfügt über mehrere benutzerwählbare Paletten, die mit der visuellen Identität des Meta Branded Themes kollidieren würden. Durch diesen Modifikator werden nur die mit dem Theme gebündelten Paletten als Optionen angeboten.
PR: FEATURE: add modifier to restrict theme color schemes
Layout in voller Breite
Wir testen zudem Anpassungen am Discourse Full-width component, um den Hauptinhalt der Seite besser zu zentrieren. Da im Header viele dynamische Elemente vorhanden sind, die die Einrichtung erschweren, ist dies bisher experimentell und nur in einem Branch der Komponente verfügbar.
Value Transformer zur Steuerung der Sichtbarkeit des Willkommensbanners
Wir haben einen neuen Value Transformer namens welcome-banner-display-for-route verwendet, um programmatisch festzulegen, auf welchen Routen das Kern-Willkommensbanner angezeigt wird. Damit stellen wir sicher, dass das Banner nur auf der standardmäßigen benutzerdefinierten Startseite erscheint und nicht auf Seiten, die ein Benutzer als persönliche Landeseite eingerichtet hat.
PR: DEV: Add welcome-banner-display-for-route value transformer
Damit kommen wir zu den beiden größeren Änderungen:
Benutzerdefinierte Startseite über einen Theme-Modifikator
Der Theme-Modifikator custom_homepage ist bereits seit fast zwei Jahren verfügbar, doch dies ist das erste Mal, dass wir ihn nutzen, um das Erlebnis der Startseite auf Meta selbst zu gestalten. Wir führen eine benutzerdefinierte Landeseite ein, die mit hervorgehobenen Komponenten gefüllt ist. Für den ersten Launch umfasst dies hervorgehobene Kategorien sowie eine Vorschau der neuesten Diskussionsbeiträge.
Diese hervorgehobenen Komponenten haben wir mit unserer neuen experimentellen Blocks-API erstellt, was uns zur größten Änderung führt:
Blocks-API: Erste Produktionseinsatz
Die Blocks-API ist ein neues Framework zum Erstellen modularer, zusammensetzbarer Layouts in Discourse. Es ermöglicht Theme-Entwicklern, Seiten aus eigenständigen, wiederverwendbaren Komponenten zusammenzustellen, die in definierte Layoutbereiche eingefügt werden können. Das Meta-Theme ist unsere erste Produktionseinsatz dieser API.
Das Framework bietet eine umfangreiche Palette an Entwickler-Tools: Aktivieren Sie die Entwickler-Tools, und Sie können die Block-Struktur jeder Seite mit einer integrierten Overlay-Ansicht inspizieren, die alle aktiven Layoutbereiche und ihre Komponenten visualisiert.
Über die Startseite hinaus nutzen wir Blocks auch, um benutzerdefinierte Kategorie-Banner zu rendern, die die Unterkategorien jeder Kategorie anzeigen:
Dies ist noch eine frühe Vorschau des Systems im Produktionskontext. Wir planen, in Kürze Dokumentation und weitere Beispiele zu veröffentlichen.
PR: DEV: Add Block API for declarative, validated UI extension points










