Veröffentlichungsdatum: 17. August 2022
Änderungsdatum: 08. August 2023
Projektgrundlage: BASE
Die Menü-Navigation (Toggler-Navigation) lässt sich komfortabel über eine Pflegemaske individuell anpassen.
Die BASE (Mobile First) wird standardmässig mit einer dunklen Farbe zur Menünavigation ausgeliefert. Das betrifft sowohl das Hamburger-Symbol (drei horizontale Striche) als auch die Schriftfarbe der Navigationstexte.
Eine andere Farbe lässt sich über eine Maske des Layout-Wizard einstellen. Rufen Sie dazu die Bearbeitung des Kopfbereiches auf, z.B. über das Weblication® Panel unter dem Zahnrad-Symbol und dort in der Spalte "Konfiguration / Layout". Im Block "Kopfbereich" klicken Sie auf die Schaltfläche "Darstellung des Kopfbereichs anpassen", um die Bearbeitung der header.scss (Kopfbereich) zu öffnen.
Hier findet sich u.a. der Block "Hauptnavigation", welcher auch Einstellungen zur Menünavigation beinhaltet. Die Darstellung der Menünavigation können Sie per Klick auf die Schaltfläche "Darstellung der Menünavigation anpassen" dort in der Maske (oder im Quelltext) definieren.
Um z.B. die Farbe des Toggler-Symbols anzupassen, hinterlegen Sie im Block "Allgemein" im Feld "Symbolfarbe der Menünavigation" die von Ihnen gewünschte Farbe (z.B. $baseColorPrimary2 oder direkt per Farbcode: #C20B21). Sofern hinter dem Farbcode eine !default Regel definert ist, löschen Sie diese am besten raus.
(!default bedeutet, dass es nur dann wirkt, wenn es nicht schon gesetzt wurde)