Dynamisches Seitenleisten-Symbol für Discourse

:information_source: Zusammenfassung Macht das Symbol zum Umschalten der Seitenleiste dynamisch und anpassbar
:hammer_and_wrench: Repository https://github.com/Lillinator/discourse-dynamic-sidebar-icon
:eyeglasses: Vorschau https://discourse.theme-creator.io/theme/Lilly/discourse-sidebar-icon
:question: Installationsanleitung So installieren Sie ein Theme oder eine Theme-Komponente
:open_book: Neu bei Discourse-Themen? Anfängerleitfaden zur Verwendung von Discourse-Themen

Dieses Theme-Komponente installieren

Dynamisches Symbol für die Discourse-Seitenleiste

:woman_technologist:t2: Zusammenfassung

Eine leichte Discourse-Theme-Komponente, die das Symbol zum Umschalten der Seitenleiste im Header dynamisch ändert, je nachdem, ob die Seitenleiste geöffnet oder geschlossen ist.

Standardmäßig zeigt die Komponente das Standard-Hamburger-Menü (bars) an, wenn die Seitenleiste geschlossen ist, und wechselt zu einem Schließen-Symbol (xmark), wenn die Seitenleiste geöffnet ist. Administratoren können auch benutzerdefinierte Icons angeben.

:star: Funktionen

  • Gibt Benutzern eine klare visuelle Rückmeldung darüber, wie sie mit der Seitenleiste interagieren können.
  • Administratoren können die Standard-Icons einfach durch beliebige FontAwesome-Icons über die Theme-Einstellungen ersetzen.
  • Diese Komponente ist ausschließlich für Desktop- und Tablet-Ansichten vorgesehen; sie hat keine Auswirkung auf mobile Geräte.

:wrench: Einstellungen

Passen Sie die zum Öffnen und Schließen der Seitenleiste verwendeten Icons an, indem Sie die Einstellungen der Komponente bearbeiten:

Einstellung Beschreibung
icon_to_open_the_sidebar Das Icon, das angezeigt wird, wenn die Seitenleiste eingeklappt ist
(Standard: bars)
icon_to_close_the_sidebar Das Icon, das angezeigt wird, wenn die Seitenleiste ausgeklappt ist
(Standard: xmark)

:warning: Wichtige Hinweise

  • Wenn Sie benutzerdefinierte Icons verwenden, die noch nicht im Kern von Discourse enthalten sind, werden sie leer angezeigt. Um dies zu beheben, müssen Sie die benutzerdefinierten Icons (z. B. rocket, cat) in der Site-Einstellung SVG-Icon-Subset in Ihren Discourse-Administrator-Einstellungen hinzufügen (siehe Alle Site-EinstellungenSVG-Icon-Subset).
  • Diese Komponente funktioniert nicht im Modus mit Dropdown-Menü im Header.
11 „Gefällt mir“

Ich habe die Komponente refaktoriert und eine neue boolesche Einstellung Open-Icon auf Mobilgeräten anzeigen hinzugefügt (standardmäßig deaktiviert). Damit können Administratoren, die das Standard-Icon bars geändert haben, entscheiden, ob sie es für die mobile Ansicht aktivieren möchten, um eine konsistente Benutzererfahrung zu gewährleisten. Die mobile Overlay-Seitenleiste verhält sich anders, sodass sich das Icon nicht ändert, wenn die Seitenleiste in einer kleinen Ansicht aktiviert wird. Ich habe den ursprünglichen Beitrag ebenfalls aktualisiert.

2 „Gefällt mir“