 |
Zusammenfassung | Discourse FontAwesome Pro ermöglicht die Verwendung von Font Awesome Pro-Icons in Discourse mit einer FontAwesome-Lizenz mithilfe des NPM-Paket-Tokens Ihres Kontos. |
 |
Repository-Link | https://github.com/discourse/discourse-fontawesome-pro |
 |
Installationsanleitung | So installieren Sie Plugins in Discourse |
Konfiguration
Dies erfordert einige zusätzliche Schritte im Vergleich zu einem normalen Plugin:
Zunächst müssen Sie eine zusätzliche Umgebungsvariable mit Ihrem Font Awesome Pro-Lizenzschlüssel einrichten: DISCOURSE_FONTAWESOME_AUTH_TOKEN
Das Installationsskript muss auch während der Initialisierung als zusätzlicher „after_code“-Hook aufgerufen werden. Dadurch werden die FontAwesome Pro-SVGs beim Build unter Verwendung Ihres Authentifizierungstokens heruntergeladen und hinzugefügt. Dies ist ein separater Block neben dem Plugin-Klon-Block.
Hier ist ein Beispiel für eine Installation in app.yml:
env:
DISCOURSE_FONTAWESOME_AUTH_TOKEN: 123456
hooks:
after_code:
- exec:
cd: $home/plugins
cmd:
- git clone https://github.com/discourse/discourse-fontawesome-pro.git
- exec:
cd: $home/plugins/discourse-fontawesome-pro
raise_on_fail: false
cmd:
- $home/plugins/discourse-fontawesome-pro/scripts/install.sh
Auswahl einer Überschreibungs-Familie:
In den Admin-Einstellungen können Sie die Standard-Icon-Familie von Discourse überschreiben:
Auswahl eines Überschreibungs-Stils:
Sie können auch den Standard-Icon-Stil überschreiben:
Duotone
Um die volle Kontrolle über die Duotone-Unterstützung zu erhalten, müssen Sie das folgende CSS überschreiben (in einem Theme oder anderweitig) und durch Ihr eigenes Farbschema ersetzen:
svg {
--fa-secondary-color: red;
--fa-secondary-opacity: 0.6;
}
Um einzelne Icons zu färben, beziehen Sie sich auf die SVG-ID:
#fad-search .fa-secondary {
--fa-secondary-color: red;
--fa-secondary-opacity: 0.6;
}
Aktualisierung des Duotone-Stylings
Wenn Sie klassenbasierte Selektoren verwenden wie:.fa-secondary { color: red; }müssen Sie Ihr Styling aktualisieren, um stattdessen CSS-Custom-Properties zu verwenden. Klassenbasierte Farb-Überschreibungen funktionieren nicht mehr, da sie in Font Awesome v7 entfernt wurden
Im Hintergrund wird das FontAwesome-Repository verwendet, um Schriftarten in den SVG-Ordner des Plugins zu installieren, sodass Discourse die Sprites von dort übernehmen kann.
Von uns gehostet? Dieses Plugin ist in unseren Enterprise-Plänen verfügbar.