Anpassungen wegen Proton

milupo

Zitat von 2002Andreas

Ja, furchbar.
Ewig diese vielen Änderungen am Fx.
Erst neulich den ganzen Umstand mit Quantum, jetzt schon wieder Proton.
Man kommt kaum noch dazu, den Fx mal ganz normal nur zum surfen zu verwenden.

milupo

Zitat von grisu2099

hr habt da bei den äußeren Buttons eine andere Breite als bei den mittleren.

Ja, ich weiß nicht, ob Folgendes wirklich der Grund ist: Für #context-navigation sind folgende Eigenschaften definiert, die die Größe beeinflussen:

--menuitem-min-width: calc(2em+16px); und

min-width: calc(4 * var(--menuitem-min-width));

Für die erste Schaltfläche #context-navigation > menuitem-iconic:first-child und die letzte Schalftläche #context-navigation> menuitem-iconic:last-child ist außerdem noch calc(var(--menuitem-min-width) + calc(100% - 4 * var(--menuitem-min-width)) / 6); definiert. Für die mittleren beiden nicht. Das deutet darauf hin, dass sich die Breite der mittleren Schaltflächen nach den anderen beiden Schaltflächen richtet.

grisu2099

Zitat von milupo

Das deutet darauf hin, dass sich die Breite der mittleren Schaltflächen nach den anderen beiden Schaltflächen richtet.

Was sie aber ja (zumindest bei mir) ohne diesen Code nicht machen...

Deswegen hatte ich diese Variante ja ausgetüftelt.

FuchsFan

Zitat von milupo

Es will vielleicht nichts bedeuten, aber in Zeile 62 sind die Kommas doch etwas eigenartig gesetzt

Danke, milupo, habe deine Hinweise hierzu (auch aus den folgenden Beiträgen) alle verarbeitet, es funktioniert.

Zitat von grisu2099

Ihr habt da bei den äußeren Buttons eine andere Breite als bei den mittleren.

Ich danke dir, habe aber nur teilweise davon Gebrauch gemacht (hilft).

Zitat von 2002Andreas

Wie schon gesagt, wenn die Icons eine eigene Farbe bekommen gibt es Probleme.

Jetzt habe ich den Code nochmals bearbeitet, für Hover aber die originale (graue) Farbe belassen, damit kann ich erst einmal leben. Eventuell gibt es doch noch eine bessere Variante.

grisu2099

Zitat von FuchsFan

Ich danke dir, habe aber nur teilweise davon Gebrauch gemacht (hilft).

Wenns hilft, ist doch alles gut...

Gern geschehen.

2002Andreas

Zitat von FuchsFan

damit kann ich erst einmal leben

Musst du aber nicht

Wenn du magst, dann teste bitte jeweils.

Dieser Code ist nur für die Icons oben:

CSS

/*Hintergrund bei hover nur oben im Kontextmenü die Icons*/

#context-back[disabled="true"] {
  color: grey !important;
}
#context-back[disabled="true"]:hover {
  background-color: greenyellow !important;
}

#context-forward[disabled="true"] {
  color: grey !important;
}
#context-forward[disabled="true"]:hover {
  background-color: greenyellow !important;
}

#context-bookmarkpage[_moz-menuactive="true"],
#context-reload[_moz-menuactive="true"],
#context-stop[_moz-menuactive="true"],
#context-to-bottom[_moz-menuactive="true"],
#context-to-top[_moz-menuactive="true"],
#context-forward[_moz-menuactive="true"],
#context-back[_moz-menuactive="true"] {
  appearance: none !important;
  --menuitem-hover-background-color: greenyellow !important;
    color: #3300ff !important;
}

Alles anzeigen

Sieht dann so aus:

Und dieser Code ist pauschal für alle Einträge und hover:

CSS

/* Pauschal für alle hover incl. dem inaktiven Vor- und Zurückpfeil im Kontextmenü*/

:is(menu,menuitem)[_moz-menuactive="true"][disabled="true"]:hover {
  color: #3300ff !important;
}

:is(menu,menuitem)[_moz-menuactive="true"] {
    appearance: none !important;
    --menuitem-hover-background-color: greenyellow !important;
    color: #3300ff !important;
}
/*Inaktiver Pfeil blasser*/
#context-back[disabled="true"] {
  color: grey !important;
  opacity: 0.4 !important;
}
#context-back[disabled="true"]:hover {
  background-color: greenyellow !important;
}

/*Inaktiver Pfeil blasser*/
#context-forward[disabled="true"] {
  opacity: 0.4 !important;
  color: grey !important;
}

#context-forward[disabled="true"]:hover {
  background-color: greenyellow !important;
}

Alles anzeigen

Das sieht dann so aus:

FuchsFan

Zitat von 2002Andreas

Wenn du magst, dann teste bitte jeweils.

Ein Dankeschön an dich, Andreas.

Ich werde das alles durchtesten, melde mich dann wieder.

2002Andreas

Zitat von FuchsFan

melde mich dann wieder.

Ok

FuchsFan

Zitat von 2002Andreas

Musst du aber nicht

Da hast du wieder was hin gezaubert.

Beide Varianten sind möglich, wobei ich mich für die Icon-Variante entschieden habe, lässt sich sehr gut in meinen bisherigen Code einarbeiten.

Ein großes Dankeschön an dich, Andreas.

Wenn du erlaubst, dann komme ich später noch auf einige Sachen zurück, die ich gerne noch bereinigt haben möchte.

2002Andreas

Zitat von FuchsFan

Ein großes Dankeschön an dich

Freut mich wenn ich helfen konnte, hat zwar etwas gedauert...

Zitat von FuchsFan

Wenn du erlaubst

Na klar...wenn ich kann dann....

FuchsFan

Zitat von 2002Andreas

Na klar...wenn ich kann dann....

Du kannst.......

So, Andreas, dann das erste Problem. Erst wenn die Zeilenhöhe bei ca 32px ist, dann ist auch die Schrift mittig, Ich habe bisher immer 25px eingestellt, da liegt dann die Schrift auf dem unteren Rand (ist dann in allen Popup so). Lässt sich das zentral für alle Menüs ändern, damit die Schrift weiter nach oben kommt?

2002Andreas

Teste bitte mal:

CSS

menupopup > menuitem, menupopup > menu {
    padding-block: 0.2em!important;
}

Evtl. musst du dir den Wert noch etwas anpassen.

FuchsFan

Zitat von 2002Andreas

Teste bitte mal:

Perfekt, Andreas, ich bedanke mich.

2002Andreas

Gerne doch

FuchsFan

2002Andreas

Mit Proton musste ich das ändern.

Nun ist dort der originale Haken in dem grünen Icon zu sehen, den ich wieder weg haben möchte, bitte helfen.

2002Andreas

Zitat von FuchsFan

bitte helfen.

Teste bitte mal, die Werte etc. musst du dir natürlich anpassen.

CSS

#placesContext > menu:nth-child(31) > menupopup:nth-child(4) > menuitem:nth-child(1)::before {
  margin-right: -20px !important; 
  margin-left: -2px !important;
  content: '' !important;
  display: block !important;
  width: 19px !important;
  height: 15px !important;
  background-image: url("file:///C:/Users/Andi/Icons%20Firefox/Domi.png") !important;
  background-repeat: no-repeat !important;
  background-position: 0px 0px !important;
  background-size: 15px 15px !important;
}

#placesContext menu#toggle_PersonalToolbar menupopup menuitem hbox.menu-iconic-left {
  visibility: hidden !important;
}

Alles anzeigen

FuchsFan

Zitat von 2002Andreas

Teste bitte mal, die Werte etc. musst du dir natürlich anpassen.

Danke, Andreas, das bastele ich mir zurecht.

2002Andreas

Zitat von FuchsFan

das bastele ich mir zurecht.

Oder auch so:

CSS

menuitem[label="Immer anzeigen"][checked="true"]::before,
menuitem[label="Nur bei neuem Tab anzeigen"][checked="true"]::before,
menuitem[label="Nie anzeigen"][checked="true"]::before {
  margin-right: -23px !important; 
  margin-left: 5px !important;
  content: '' !important;
  display: block !important;
  width: 19px !important;
  height: 15px !important;
  background-image: url("file:///C:/Users/Andi/Icons%20Firefox/Computer_File_020.gif") !important;
  background-repeat: no-repeat !important;
  background-position: 0px 0px !important;
  background-size: 15px 15px !important;
}

 menu#toggle_PersonalToolbar menupopup menuitem hbox.menu-iconic-left {
  visibility: hidden !important;
}

Alles anzeigen

Oder auch pauschal:

CSS

menuitem[checked="true"]::before {
  margin-right: -23px !important; 
  margin-left: 5px !important;
  content: '' !important;
  display: block !important;
  width: 19px !important;
  height: 15px !important;
  background-image: url("file:///C:/Users/Andi/Icons%20Firefox/Computer_File_020.gif") !important;
  background-repeat: no-repeat !important;
  background-position: 0px 0px !important;
  background-size: 15px 15px !important;
}

menuitem[checked="true"] > .menu-iconic-left {
  visibility: hidden !important;
}

Alles anzeigen

FuchsFan

Zitat von 2002Andreas

Oder auch so:

Sehr gut, diese funktionieren beide. Danke !

2002Andreas

Gerne wie immer

Du kannst auch einen pauschalen Code für alle Haken nehmen:

CSS

menuitem[checked="true"]::before {
  margin-right: -23px !important; 
  margin-left: 5px !important;
  content: '' !important;
  display: block !important;
  width: 19px !important;
  height: 15px !important;
  background-image: url("file:///C:/Users/Andi/Icons%20Firefox/check.png") !important;
  background-repeat: no-repeat !important;
  background-position: 0px 0px !important;
  background-size: 15px 15px !important;
}

menuitem[checked="true"] > .menu-iconic-left {
  visibility: hidden !important;
}

Alles anzeigen