Icona barra laterale dinamica di Discourse

:information_source: Riepilogo Rende l’icona di attivazione della barra laterale dinamica e personalizzabile
:hammer_and_wrench: Repository https://github.com/Lillinator/discourse-dynamic-sidebar-icon
:eyeglasses: Anteprima https://discourse.theme-creator.io/theme/Lilly/discourse-sidebar-icon
:question: Guida all’installazione Come installare un tema o un componente del tema
:open_book: Nuovo ai temi di Discourse? Guida per principianti all’uso dei temi di Discourse

Installa questo componente del tema

Icona Dinamica della Barra Laterale di Discourse

:woman_technologist:t2: Riepilogo

Un componente leggero per i temi di Discourse che modifica dinamicamente l’icona di attivazione della barra laterale nell’intestazione in base allo stato di apertura o chiusura della barra stessa.

Per impostazione predefinita, il componente mostra il classico menu hamburger (bars) quando la barra laterale è chiusa e passa a un’icona di chiusura (xmark) quando la barra laterale è aperta. Gli amministratori possono anche specificare icone personalizzate.

:star: Caratteristiche

  • Fornisce agli utenti un chiaro feedback visivo su come interagire con la barra laterale.
  • Gli amministratori possono facilmente sostituire le icone predefinite con qualsiasi icona di FontAwesome tramite le impostazioni del tema.
  • Questo componente è esclusivo per le visualizzazioni desktop e tablet; non ha alcun effetto su mobile.

:wrench: Impostazioni

Personalizza le icone utilizzate per aprire e chiudere la barra laterale modificando le impostazioni del componente:

setting description
icon_to_open_the_sidebar l’icona visualizzata quando la barra laterale è compressa
(predefinita: bars)
icon_to_close_the_sidebar l’icona visualizzata quando la barra laterale è espansa
(predefinita: xmark)

:warning: Note Importanti

  • Se si utilizzano icone personalizzate che non sono già incluse nel nucleo di Discourse, appariranno vuote; per risolvere il problema, è necessario aggiungere le icone personalizzate (ad esempio rocket, cat) all’impostazione del sito SVG icon subset nelle impostazioni di amministrazione di Discourse (vedi All Site SettingsSVG icon subset).
  • Questo componente non funziona con la modalità a tendina dell’intestazione.
12 Mi Piace

Ho refattorizzato il componente e aggiunto una nuova impostazione booleana Applica icona aperta su mobile (predefinito: disabilitata). Questo permette agli amministratori che modificano l’icona aperta da quella predefinita bars di scegliere se abilitarla sulle dimensioni della visualizzazione mobile per garantire coerenza nell’esperienza utente. La barra laterale di sovrapposizione mobile si comporta in modo diverso, quindi l’icona non cambia quando la barra laterale viene attivata su visualizzazioni di piccole dimensioni. Ho aggiornato anche il primo post.

3 Mi Piace