Bunas Template - Wie Burger Menu (Toggle) Color ändern?

Hallo Zusammen,

weiß zufällig jemand von euch, wie man beim Bunas Template (J4, Helix Ultimate 2.0.9) die Farbe des Burger-Menüs (auch Toggle oder Toggle-Bar-Icon genannt) wechselt?

In der Mobilansicht sieht man das Icon nicht, weil der Header fast schwarz ist und das Menü-Icon bzw. die 3 Balken scheinbar auch schwarz sind.

Beim Scrollen wechselt der Header zu einem weißen Sticky Header (gewollt) und dann sieht man es, aber eben erst dann!

Es soll aussehen, wie in der Demo (also muss es ja irgendwie einzustellen sein)

Bunas - Multipurpose Business and Corporate Joomla 4 Template Preview - ThemeForest

Beste Grüße, Snafu (Chris)

Mach ich gern, der Link ist ...

Eure Musiksendung

Moin Dirk,

ich habe den CSS-Code mal dem bestehenden Code unten, als letzte Position angefügt.

Es klappt insoweit, dass ich dadurch eine einheitliche, durchgehende Burgermenu-Farbe festlegen kann.

Also ich könnte jetzt einen Grauton bestimmen, der idealerweise auf schwarzem u. weißen Hintergrund sichtbar ist.

Wenn ich weiß (also 'ffffff) wähle, sieht man das Menu auf dem weißen Sticky Header nicht mehr.

Einen geteilten Befehl zu geben, ist nicht so einfach möglich oder? (=sei auf schwarz weiß, sei auf weiß schwarz)

Vielen Dank schonmal für die schnelle Hilfe!

Hier auch mal der jetzt aktuell enthaltene CSS Code (falls dafür wichtig) ...

#sp-header {
 background: transparent;
 position: absolute;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
#sp-header .logo a .logo-image,
#sp-header .logo a .logo-image-phone {
 filter: grayscale(100%) invert(100%) brightness(100);
}
#sp-header.header-sticky .logo a .logo-image,
#sp-header.header-sticky .logo a .logo-image-phone {
 filter: none;
}
.sp-megamenu-parent > li > a {
 color: #ffffff;
}
@media (max-width: 1200px) {
.sp-megamenu-parent > li > a {
padding: 35px 12px;
}
}
.sp-megamenu-parent > li.menu-search {
 border-left: 1px solid rgba(255, 255, 255, 0.1);
 min-height: 90px;
padding-left: 10px;
margin-left: 20px;
}
.sp-megamenu-parent > li.menu-search > a {
 font-size: 18px;
}
.sp-megamenu-parent > li.menu-btn {display: none;}
#offcanvas-toggler > .fa {
 color: #fff;
}
.sp-megamenu-parent > li.active > a {
color: #fff;
}
.sp-megamenu-parent > li.active > a:before {
 position: absolute;
 left: 0;
 bottom: -2px;
 content: "";
 height: 3px;
 width: 80%;
 background: var(--maincolor);
}
.burger-icon > span {
 background-color: #969696;
}

Perfekt!!!

Herzlichen Dank!

Dann ist die Frage für mich geklärt! Funktioniert wunderbar! Danke euch für die schnelle Hilfe!