 |
Riepilogo | Discourse FontAwesome Pro consente l’uso di icone Font Awesome Pro in Discourse con una licenza FontAwesome utilizzando il token del pacchetto NPM del tuo account. |
 |
Link al repository | https://github.com/discourse/discourse-fontawesome-pro |
 |
Guida all’installazione | Come installare i plugin in Discourse |
Configurazione
Per abilitare questo plugin, sono necessari alcuni passaggi aggiuntivi rispetto a un plugin normale:
Prima di tutto, dovrai impostare una variabile di ambiente aggiuntiva contenente il token del tuo pacchetto font awesome pro (nota che questo è diverso dal tuo token API): DISCOURSE_FONTAWESOME_AUTH_TOKEN
Lo script di installazione deve anche essere chiamato durante l’inizializzazione, come hook aggiuntivo “after_code”. Questo scarica e aggiunge gli SVG di FontAwesome Pro durante la build utilizzando il tuo token di autenticazione. Questo è un blocco aggiuntivo separato dal blocco di clonazione del plugin.
Ecco un esempio di installazione 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
Scelta di una famiglia di override:
Nelle impostazioni di amministrazione, puoi sovrascrivere la famiglia di icone predefinita di Discourse:
Scelta di uno stile di override:
Puoi anche sovrascrivere lo stile delle icone predefinito:
Duotone
Per prendere il pieno controllo del supporto duotone, dovrai sovrascrivere il seguente CSS (in un tema, o in altro modo) e sostituirlo con il tuo schema di colori:
svg {
--fa-secondary-color: red;
--fa-secondary-opacity: 0.6;
}
Per colorare icone individuali, fai riferimento all’ID dello SVG:
#fad-search .fa-secondary {
--fa-secondary-color: red;
--fa-secondary-opacity: 0.6;
}
Aggiornamento dello stile Duotone
Se stai usando selettori basati su classi come:.fa-secondary { color: red; }Dovrai aggiornare il tuo stile per utilizzare proprietà CSS personalizzate al posto di questo. Le sovrascritture dei colori basate su classi non funzionano più poiché sono state rimosse in Font Awesome v7
Sotto la superficie, questo utilizza il repository di FontAwesome per installare i font nella cartella SVG del plugin, consentendo a Discourse di recuperare gli sprite da lì.
