FontAwesome Pro per Discourse

[Discourse]

	Riepilogo	Discourse FontAwesome Pro consente l’utilizzo delle 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

Poiché si tratta di un plugin #ufficiale mantenuto dal team di Discourse, le richieste di #supporto, #segnalazione:bug, #contributo:ux e #contributo:funzionalità possono essere inviate nelle rispettive categorie qui su Meta, contrassegnate con l’etichetta del plugin appropriata. Clicca su uno dei link sottostanti per crearne una.

 Supporto  Bug  UX  Funzionalità

Configurazione

Questa configurazione richiede alcuni passaggi aggiuntivi rispetto a un plugin normale:

Innanzitutto, devi impostare una variabile d’ambiente aggiuntiva contenente la tua chiave di licenza Font Awesome Pro: 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 compilazione utilizzando il tuo token di autenticazione. Si tratta di 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 predefinito delle icone:

Duotone

Per avere il pieno controllo del supporto duotone, dovrai sovrascrivere il seguente CSS (in un tema o altrimenti) e sostituirlo con la tua combinazione di colori:

svg {
  --fa-secondary-color: red;
  --fa-secondary-opacity: 0.6;
}

Per colorare le singole icone, fai riferimento all’ID dell’SVG:

#fad-search .fa-secondary {
  --fa-secondary-color: red;
  --fa-secondary-opacity: 0.6;
}

Aggiornamento allo stile duotone
Se stai utilizzando selettori basati su classi come:

.fa-secondary { color: red; }

Dovrai aggiornare il tuo stile per utilizzare le proprietà CSS personalizzate invece. Le sovrascrizioni di colore basate su classi non funzionano più poiché sono state rimosse in Font Awesome v7

---

Sotto il cofano, questo utilizza il repository di FontAwesome per installare i font nella cartella SVG del plugin, permettendo a Discourse di recuperare gli sprite da lì.

Ospitato da noi? Questo plugin è disponibile nei nostri piani Enterprise.