Neu Shop 5 NOVA: Hintergrundfarbe für Mega-Menu ändern

[liquid]

Hallo zusammen,

ich möchte gerne die Hintergrundfarbe für das Mega-Menu ändern (nicht für den ganzen Header, nur für die Menuzeile), allerdings ohne Dropdown bei Mousehover (der soll weiß bleiben). Passend dazu soll dann auch die Schrift für die Hauptkategorien weiß werden.

Ich stehe gerade etwas auf dem Schlauch und finde die CSS-Klassen dafür gerade nicht (ist wohl uhrzeitbedingt). Hat die jemand von Euch parat?

Vielen Dank vorab!

Beste Grüße
Ingo

 

[MHillmann]

Hallo @liquid

ich hoffe du bist schon in einem Child-Template unterwegs und hast den Theme-Editor, falls nicht: https://jtl-devguide.readthedocs.io/projects/jtl-shop/de/latest/shop_templates/primary_color.html
Ich würde empfehlen, dass du die folgenden beiden Variablen überschreibst. Das wäre dann der gesamte header.

$header-bg-color:                  pink;
$header-color:                     brown;

Die topbar kannst du danach wieder weiß machen:

#header-top-bar {
    background-color: white;
    color: green;
}

Viele Grüße
Michael

 

[liquid]

Hallo Michael,

hat nahezu funktioniert: Das Megamenu ist jetzt zwar grün, aber leider auch der Bereich darüber mit der Suchleiste. Wird daran liegen, dass ich das Header-Plugin nutze und die Position des Suchfeldes verschoben habe. Problem ist also, den oberen Bereich wieder "weiß" zu bekommen. Das sieht bei mir gerade umso blöder aus, weil das Logo ja mit in diesem "oberen" Bereich platziert ist und das hat einen weißen Background.



Gruß
Ingo

 

[MHillmann]

Aso, mit dem Header-Plugin ist das leider nicht so gut möglich. Da müsstest du auf den container stylen der das megamenü umschließt, dafür wäre aber noch eine Klasse an dem container gut, sonst kommt man da per CSS nicht so gut ran..
Außerdem müsstest du den Header auf voller Breite nutzen.

 

[liquid]

Aso, mit dem Header-Plugin ist das leider nicht so gut möglich. Da müsstest du auf den container stylen der das megamenü umschließt, dafür wäre aber noch eine Klasse an dem container gut, sonst kommt man da per CSS nicht so gut ran..
Außerdem müsstest du den Header auf voller Breite nutzen.

Ich habe es jetzt mit folgender Klasse teilweise hinbekommen (Header/Mega-Menu ist auf boxed gestellt):

.navbar-nav.nav-scrollbar-inner {
background-color: #39AC39;
}

Allerdings zeigt die Vergabe der Textfarbe für die Klasse keine Wirkung, sie scheint an anderer Stelle überschrieben zu werden. $header-color kann ich dafür nicht nutzen, dann wird alles weiß, auch der Bereich mit dem (immer noch) weißen Hintergrund.

Ich bin kurz davor, aufzugeben. Wenn es absolut nicht funktioniert, dann werde ich hier mit Dropper arbeiten, wenn das von Kreativkonzentrat (hoffentlich zeitnah, war ja angekündigt) für Shop 5 freigegeben wird.

Gruß
Ingo

 

[Nivek]

Ich habe es jetzt mit folgender Klasse teilweise hinbekommen (Header/Mega-Menu ist auf boxed gestellt):

.navbar-nav.nav-scrollbar-inner {
background-color: #39AC39;
}

Allerdings zeigt die Vergabe der Textfarbe für die Klasse keine Wirkung, sie scheint an anderer Stelle überschrieben zu werden. $header-color kann ich dafür nicht nutzen, dann wird alles weiß, auch der Bereich mit dem (immer noch) weißen Hintergrund.

Ich bin kurz davor, aufzugeben. Wenn es absolut nicht funktioniert, dann werde ich hier mit Dropper arbeiten, wenn das von Kreativkonzentrat (hoffentlich zeitnah, war ja angekündigt) für Shop 5 freigegeben wird.

Gruß
Ingo

Hallo Ingo, hast du das hinbekommen? Stehe vor dem gleichen Problem, dass ich gerne den Header in einer anderen Farbe wie das MegaMenü hätte.


Gruß Kevin