Hier noch der verwendete Code:
Sieht hier so damit aus:
Dann funkt dir noch ein anderer Code dazwischen.
Hier noch der verwendete Code:
Sieht hier so damit aus:
Dann funkt dir noch ein anderer Code dazwischen.
ZitatDass der Code auch auf Websites wirkt, hat mit dem Selektor "menuitem" zu tun.
Das hatte BrokenHeart einst herausgefunden, dass Firefox die Auswahlmenüs bei amazon für sich so umsetzt. Sowas muss bekannt sein für diesen Selektor!
Hier noch der verwendete Code:
Sieht hier so damit aus:
Dann funkt dir noch ein anderer Code dazwischen.
Für den Hintergrund nutze ich
/*5. Farbe Rechtsklickmenü + Dropdown menüs in Menüleiste*/
arrowscrollbox.menupopup-arrowscrollbox {
--menuitem-hover-background-color: #2B2C86 !important;
--panel-color: #fff !important;
--menu-color: #fff !important;
--menu-disabled-color: lightgrey !important;
--panel-background: #000080 !important;
--panel-border-color: #000080 !important;
--panel-border-radius: 5px !important;
}
Diesen habe ich gerade testweise auskommentiert. Da die Originalfarbe weiß mit schwarzer Schrift ist, fällt mein obiges Verhalten (s. .gif) auch nur auf, wenn man den Hintergrund farbig hat. Außerdem: Teste das mal bei einem Menüpunkt mit dem Rechtspfeil (wie Tableiste > "Lesezeichen-Symbolleiste") und fahre wie ich im .gif aus dem Menü. Dann siehst du, was ich die ganze Zeit meine.
dass Firefox die Auswahlmenüs bei amazon für sich so umsetzt.
Nicht nur bei Amazon ist das so. Das betrifft generell das <select>-Element, wie es bei einem ganz großen Teil aller Websites zum Einsatz kommt.
Dann siehst du, was ich die ganze Zeit meine.
Ok, jetzt kann ich das nachvollziehen
Das liegt am fehlenden focus über dem Menü.
Teste bitte wieder:
/*4. hover Farbe in allen pop-up menüs ändern*/
@-moz-document url-prefix("chrome://browser/content/browser.xhtml") {
menupopup > menu[open]:not(focus){
background: #8888b3 !important;
color: white !important;
border-radius: 9px !important;
}
menupopup > :is(menu,menuitem)[disabled="true"]:not(#ContentSelectDropdown > menupopup > menuitem):hover {
color: white !important;
border-radius: 9px !important;
background-color: #2b2c86 !important; /* old: #87CEFF */
}
menupopup > :is(menu,menuitem):not([disabled="true"]):not(#ContentSelectDropdown > menupopup > menuitem):hover {
color: #fff !important;
border-radius: 10px !important;
background-color: #8888b3 !important; /* old: #87CEFF */
}
}
Alles anzeigen
Zeile 4 - 8 sind neu.
Dann siehst du, was ich die ganze Zeit meine.
Ok, jetzt kann ich das nachvollziehen
Das liegt am fehlenden focus über dem Menü.
Teste bitte wieder:
CSS Alles anzeigen/*4. hover Farbe in allen pop-up menüs ändern*/ @-moz-document url-prefix("chrome://browser/content/browser.xhtml") { menupopup > menu[open]:not(focus){ background: #8888b3 !important; color: white !important; border-radius: 9px !important; } menupopup > :is(menu,menuitem)[disabled="true"]:not(#ContentSelectDropdown > menupopup > menuitem):hover { color: white !important; border-radius: 9px !important; background-color: #2b2c86 !important; /* old: #87CEFF */ } menupopup > :is(menu,menuitem):not([disabled="true"]):not(#ContentSelectDropdown > menupopup > menuitem):hover { color: #fff !important; border-radius: 10px !important; background-color: #8888b3 !important; /* old: #87CEFF */ } }
Zeile 4 - 8 sind neu.
Besser, aber noch nicht 100 % perfekt:
- wenn man mit der Maus etwas schneller über die Menüpunkte (ohne Pfeil) fährt, scheint die falsche Farbe weiterhin durch, nur bei dem "aus dem Menü fahren" ist das jetzt weg.
- Bei [disabled="true"] wirkt der Code nicht auf die obere Schaltflächenleiste im Kontextmenü (Pfeil vor, Pfeil zurück, Seite neu laden-Pfeil, Lesezeichen-Stern)
wirkt der Code nicht auf die obere Schaltflächenleiste im Kontextmenü
Davon war in diesem Thread bisher auch nicht die Rede.
Teste wieder:
/*4. hover Farbe in allen pop-up menüs ändern*/
@-moz-document url-prefix("chrome://browser/content/browser.xhtml") {
menupopup > menu[open]:not(focus) {
background: #8888b3 !important;
color: white !important;
border-radius: 9px !important;
}
menupopup > :is(menu,menuitem)[disabled="true"]:not(#ContentSelectDropdown > menupopup > menuitem):hover {
color: white !important;
border-radius: 9px !important;
background-color: #2b2c86 !important;
}
menupopup > :is(menu,menuitem):not([disabled="true"]):not(#ContentSelectDropdown > menupopup > menuitem):hover {
color: #fff !important;
border-radius: 10px !important;
background-color: #8888b3 !important;
}
#context-navigation > :is(menu,menuitem)[disabled="true"]:not(#ContentSelectDropdown > menupopup > menuitem):hover {
color: white !important;
border-radius: 9px !important;
background-color: #2b2c86 !important;
}
#context-navigation > :is(menu,menuitem):not([disabled="true"]):not(#ContentSelectDropdown > menupopup > menuitem):hover {
color: #fff !important;
border-radius: 10px !important;
background-color: #8888b3 !important;
}
#context-navigation > .menuitem-iconic:not([disabled="true"]):hover {
background-color: #8888b3 !important;
color: white !important;
}
#context-navigation > .menuitem-iconic[disabled="true"]:hover {
background-color: #2b2c86 !important;
color: #fff !important;
}
}
Alles anzeigen
wirkt der Code nicht auf die obere Schaltflächenleiste im Kontextmenü
Davon war in diesem Thread bisher auch nicht die Rede.
Teste wieder:
CSS Alles anzeigen/*4. hover Farbe in allen pop-up menüs ändern*/ @-moz-document url-prefix("chrome://browser/content/browser.xhtml") { menupopup > menu[open]:not(focus) { background: #8888b3 !important; color: white !important; border-radius: 9px !important; } menupopup > :is(menu,menuitem)[disabled="true"]:not(#ContentSelectDropdown > menupopup > menuitem):hover { color: white !important; border-radius: 9px !important; background-color: #2b2c86 !important; } menupopup > :is(menu,menuitem):not([disabled="true"]):not(#ContentSelectDropdown > menupopup > menuitem):hover { color: #fff !important; border-radius: 10px !important; background-color: #8888b3 !important; } #context-navigation > :is(menu,menuitem)[disabled="true"]:not(#ContentSelectDropdown > menupopup > menuitem):hover { color: white !important; border-radius: 9px !important; background-color: #2b2c86 !important; } #context-navigation > :is(menu,menuitem):not([disabled="true"]):not(#ContentSelectDropdown > menupopup > menuitem):hover { color: #fff !important; border-radius: 10px !important; background-color: #8888b3 !important; } #context-navigation > .menuitem-iconic:not([disabled="true"]):hover { background-color: #8888b3 !important; color: white !important; } #context-navigation > .menuitem-iconic[disabled="true"]:hover { background-color: #2b2c86 !important; color: #fff !important; } }
Danke, aber
- wenn man mit der Maus etwas schneller über die Menüpunkte (ohne Pfeil) fährt, scheint die falsche Farbe weiterhin durch, nur bei dem "aus dem Menü fahren" ist das jetzt weg.
Existiert immer noch. Das ganze merkt man an diesen "ruckeln" beim drüberfahren. Mit dem Code von Mira_Belle läuft das ganze flüssiger. Da hat man diesen Effekt nicht.
Mit dem Code von
Dann musst du den nehmen, und dir die Farben anpassen:
menu:not(#ContentSelectDropdown > menupopup > menuitem),
menuitem:not(#ContentSelectDropdown > menupopup > menuitem) {
&:where([disabled="true"]) {
border-radius: 10px !important;
/* color:color: #ffff !important; */
text-shadow: none;
}
&:where([_moz-menuactive]:not([disabled="true"])) {
border-radius: 10px !important;
color: lime !important; /* Schriftfarbe aktiv (hover) */
background-color: red !important; /* Feld aktiv (hover) */
}
&:where([_moz-menuactive="true"][disabled="true"]) {
border-radius: 10px !important;
color: yellow !important; /* Schriftfarbe inaktiv (hover) */
background-color: green !important; /* Feld inaktiv (hover) */
}
}
Alles anzeigen
menu:not(#ContentSelectDropdown > menupopup > menuitem),
menuitem:not(#ContentSelectDropdown > menupopup > menuitem) {
Das war es! Danke Dir 2002Andreas , da wäre ich nie draufgekommen.
Danke Dir
Alles ist gut, gern geschehen
Mit dem Code von
Dann musst du den nehmen, und dir die Farben anpassen:
CSS Alles anzeigenmenu:not(#ContentSelectDropdown > menupopup > menuitem), menuitem:not(#ContentSelectDropdown > menupopup > menuitem) { &:where([disabled="true"]) { border-radius: 10px !important; /* color:color: #ffff !important; */ text-shadow: none; } &:where([_moz-menuactive]:not([disabled="true"])) { border-radius: 10px !important; color: lime !important; /* Schriftfarbe aktiv (hover) */ background-color: red !important; /* Feld aktiv (hover) */ } &:where([_moz-menuactive="true"][disabled="true"]) { border-radius: 10px !important; color: yellow !important; /* Schriftfarbe inaktiv (hover) */ background-color: green !important; /* Feld inaktiv (hover) */ } }
Vielen Dank für deine Mühe. Jetzt passt endlich alles
Jetzt passt endlich alles
Vielen Dank für deine Mühe.
Gern geschehen, hat zwar eine Weile gedauert....