Icône de barre latérale dynamique

:information_source: Résumé Rendre l’icône de bascule de la barre latérale dynamique et personnalisable
:hammer_and_wrench: Dépôt https://github.com/Lillinator/dynamic-sidebar-icon
:eyeglasses: Aperçu https://discourse.theme-creator.io/theme/Lilly/discourse-sidebar-icon
:question: Guide d’installation Comment installer un thème ou un composant de thème

Installer ce composant de thème

:woman_technologist:t2: Aperçu

Un composant de thème Discourse léger qui modifie dynamiquement l’icône de bascule de la barre latérale dans l’en-tête en fonction du fait que la barre latérale soit ouverte ou fermée.

Par défaut, le composant affiche l’icône de menu hamburger standard (bars) lorsque la barre latérale est fermée, et passe à une icône de fermeture en X (xmark) lorsque la barre latérale est ouverte.

Les administrateurs peuvent spécifier des icônes personnalisées à la place, s’ils le souhaitent, et choisir également de l’activer pour la vue mobile (bien que l’aspect dynamique du composant ne s’applique qu’aux tailles de fenêtre de visualisation non mobiles, les administrateurs qui modifient l’icône ouverte peuvent souhaiter une cohérence avec leur expérience utilisateur mobile).


:star: Fonctionnalités

  • Fournit aux utilisateurs un retour visuel clair sur la manière d’interagir avec la barre latérale.
  • Les administrateurs peuvent facilement remplacer les icônes par défaut par n’importe quelle icône FontAwesome via les paramètres du thème.
  • Permet d’activer une icône de barre latérale remplacée pour la cohérence de l’expérience utilisateur sur les fenêtres de visualisation mobiles.

:movie_camera: Captures vidéo

Paramètres par défaut du composant :

Utilisation des icônes dog et cat :


:wrench: Paramètres

Personnalisez les icônes utilisées pour ouvrir et fermer la barre latérale en modifiant les paramètres du composant :

paramètre description
Icon_to_open_the_sidebar l’icône affichée lorsque la barre latérale est réduite
(par défaut : bars)
Icon_to_close_the_sidebar l’icône affichée lorsque la barre latérale est développée
(par défaut : xmark)
Apply_open_icon_on_mobile appliquer l’icône « ouverte » personnalisée sur la fenêtre de visualisation mobile
(par défaut : false)

:warning: Remarques

  • Si vous utilisez des icônes personnalisées qui ne sont pas déjà incluses dans Discourse core, elles apparaîtront vides ; pour corriger cela, vous devez ajouter les icônes personnalisées (par exemple, rocket, cat) au paramètre de site SVG icon subset dans les paramètres administrateur de votre Discourse (voir All Site SettingsSVG icon subset).
  • Ce composant ne fonctionne pas avec le mode déroulant de l’en-tête.

Découvrez mes autres créations Discourse
14 « J'aime »

J’ai refactorisé le composant et ajouté un nouveau paramètre booléen Appliquer l'icône ouverte sur mobile (désactivé par défaut). Cela permet aux administrateurs qui modifient l’icône d’ouverture par défaut (bars) de choisir de l’activer pour les vues mobiles afin d’assurer une cohérence de l’expérience utilisateur. La barre latérale de superposition mobile se comporte différemment, de sorte que l’icône ne change pas lorsque la barre latérale est activée sur un petit format d’écran. J’ai également mis à jour le message original.

5 « J'aime »