Quadratischer Hintergrund des Reload-Buttons im Kontextmenü hat plötzlich eine andere Hintergrundfarbe beim Hovern

Hallo,

vor Firefox 89 hatte der Reload-Button im Kontextmenü die gleiche Hintergrundfarbe wie der Rest des Feldes, jetzt ist es plötzlich weiß (siehe Screenshot). Kann jemand helfen, was dabei geändert werden muss, damit es wieder einheitlich ist?

Ich habe es jetzt endlich herausgefunden. Seit Proton gibt es folgenden Eintrag, der dafür verantwortlich ist und den man so entfernen kann:

menupopup{
--menuitem-hover-background-color: none !important;
}

Dann funktioniert folgender Code endlich wie vorher und es gibt kein weiße Färbung beim Hovern über dem Reload-Button:

menupopup menuitem:hover{
-moz-appearance:none!important;
background-color: #a39c92 !important;
color: white !important;
height: 22px !important;
}

Geht auch, aber dann habe ich immer noch so einen kurzen unschönen Effekt beim Hovern.

Aber Danke für die Alternative.

Seit Firefox 107 gibt es leider wie oben schon gezeigt wieder den weißen Hintergrund beim Hovern. Kann jemand helfen?:

menupopup{
--menuitem-hover-background-color: none !important;
}

menupopup menuitem:hover{
appearance:none!important;
background-color: #a39c92 !important;
color: white !important;
height: 22px !important;
}

Hat nicht den gewünschten Effekt. Soll ja so aussehen wie oben, sieht aber aktuell so aus:

Leider kommt dieses weiße Quadrat erneut bzw. blitzt kurz auf, wenn man sich vom Reload-Button wegbewegt.

Genau wie in Beitrag 1.

Also ich habe es jetzt fast geschafft, brauche nur noch ein klein wenig Hilfe. Mit folgendem Code sieht es so aus. Jetzt bräuchte ich nur noch die Codeanpassung, dass der obere Bereich beim Reload-Button gesamt ausgefüllt wird und nicht nur das Quadrat:

menupopup menuitem:not(#context-navigation > .menuitem-iconic):hover{
appearance:none!important;
background-color: #a39c92 !important;
color: white !important;
height: 22px !important;
}

#context-navigation > .menuitem-iconic:hover > hbox > image {
    background-color: #a39c92 !important;
    fill: white !important;
}

#context-navigation > .menuitem-iconic[disabled="true"]:hover > hbox > image {
    background-color: #a39c92 !important;
    color: white !important;
}

Danke dir, musste nur den letzten Absatz ändern. So ist jetzt alles nach meinen Wünschen wie vorher:

menupopup menuitem:not(#context-navigation> .menuitem-iconic):hover{
appearance:none!important;
background-color: #a39c92 !important;
color: white !important;
height: 22px !important;
}

#context-navigation > .menuitem-iconic:not([disabled="true"]):hover > hbox > image {
  background: none !important;
  color: white !important;
}

#context-navigation > .menuitem-iconic[disabled="true"]:hover > hbox > image  {
  background: none !important;
  color: white !important;
 }
#context-navigation > .menuitem-iconic > .menu-iconic-left > .menu-iconic-icon {
  background: none !important;
}

 #context-navigation > .menuitem-iconic[_moz-menuactive="true"] {
        background-color: #a39c92 !important; 
    }

Seit Firefox 108 gibt es wieder ein Problem. Jetzt zieht sich beim Hovern über den Kontextmenüeintrag dieser zusammen.

Siehe diese beiden Screenshots:

Perfekt, herzlichen Dank. Das Problem ist gelöst.