Hallo Dharkness
Teste mal:
Damit wird hier der Pfeil rot. Farbe kannst Du dir ja selber einstellen.
Vielleicht reicht Dir das schon.
Mfg.
Endor
Hallo Dharkness
Teste mal:
Damit wird hier der Pfeil rot. Farbe kannst Du dir ja selber einstellen.
Vielleicht reicht Dir das schon.
Mfg.
Endor
geht was in die Richtung?
Ich habe mal den Code von Horstmann aus Beitrag Nr. 11 erweitert.
Ich musste auch 2 weitere Icons nehmen, Hoch und Runter, weil es ansonsten Probleme mit dem Drehen gab.
#tabbrowser-arrowscrollbox {
--custom-right-image: url("file:///C:/Users/Andi/Icons%20Firefox/rechts.png") !important;
--custom-left-image: url("file:///C:/Users/Andi/Icons%20Firefox/links.png") !important;
--custom-arrow-transform: scale(1) !important;
}
#scrollbutton-down > .toolbarbutton-icon {
list-style-image: var(--custom-right-image) !important;
transform: var(--custom-arrow-transform) !important;
}
#scrollbutton-up > .toolbarbutton-icon {
list-style-image: var(--custom-left-image) !important;
transform: var(--custom-arrow-transform) !important;
}
toolbarbutton#scrollbutton-up {
list-style-image: url("file:///C:/Users/Andi/Icons%20Firefox/Hoch.gif") !important;
}
toolbarbutton#scrollbutton-down {
list-style-image: url("file:///C:/Users/Andi/Icons%20Firefox/Runter.gif") !important;
}
Alles anzeigen
PS:
Mit einem Bildprogramm lassen sich natürlich auch die anderen Pfeile drehen.
Damit wird hier der Pfeil rot.
Hallo Endor.
Das betrifft dann aber auch die Pfeile in der Tableiste, und nicht nur im Lesezeichenpopup.
Hier noch ein Vorschlag, falls es sonst jemand mal testen möchte:
#tabbrowser-arrowscrollbox, .menupopup-arrowscrollbox {
--custom-right-image: url("pfeiltest-rechts.png");
--custom-left-image: url("pfeiltest-links.png");
}
#tabbrowser-arrowscrollbox {
--custom-arrow-transform: scale(1);
}
.menupopup-arrowscrollbox {
--custom-arrow-transform: rotate(90deg) !important;
}
#scrollbutton-down > .toolbarbutton-icon {
list-style-image: var(--custom-right-image) !important;
transform: var(--custom-arrow-transform) !important;
}
#scrollbutton-up > .toolbarbutton-icon {
list-style-image: var(--custom-left-image) !important;
transform: var(--custom-arrow-transform) !important;
}
Alles anzeigen
Der Sinn der Übung wäre mit zwei separaten Pfeilicons (rechts/links) sowohl die Tableiste als auch die Menüpopups (hoffentlich alle) bedienen zu können.
hier noch ein Vorschlag
Der ist besser als meiner aus Beitrag Nr. 22
hier noch ein Vorschlag
Der ist besser als meiner aus Beitrag Nr. 22
Dankeschön, wir haben uns knapp überschnitten.
War aber ein kleiner Fehler drin, jetzt korrigiert.
Hallo 2002Andreas und Horstmann,
eure CSS-Schnipsel zeigen hier für die überlaufenden Lesezeichenmenüs keine Wirkung.
keine Wirkung.
Dann funkt dir etwas anderes dazwischen
So sieht das hier mit meinem Code aus:
Und so mit dem von Horstmann
Eingetragen jeweils in die userChrome.css.
Eingetragen jeweils in die userChrome.css.
Das ↓ steht bei mir in einer Datei die per @import über die userChrome.css geladen wird, die Anpassung für die Tabbar-Scrollbutton funktioniert, die für die Menüs nicht.
#tabbrowser-arrowscrollbox {
/* --custom-right-image: url("file:///C:/Users/Andi/Icons%20Firefox/rechts.png") !important; */
--custom-right-image: url("file:///H:/Profile/Firefox/Fx57-H-Default/chrome/icons/rechts.png");
/* --custom-left-image: url("file:///C:/Users/Andi/Icons%20Firefox/links.png") !important; */
--custom-left-image: url("file:///H:/Profile/Firefox/Fx57-H-Default/chrome/icons/links.png");
--custom-arrow-transform: scale(1) !important;
}
#scrollbutton-down > .toolbarbutton-icon {
list-style-image: var(--custom-right-image) !important;
transform: var(--custom-arrow-transform) !important;
}
#scrollbutton-up > .toolbarbutton-icon {
list-style-image: var(--custom-left-image) !important;
/* transform: var(--custom-arrow-transform) !important; */
}
toolbarbutton#scrollbutton-up {
/* list-style-image: url("file:///C:/Users/Andi/Icons%20Firefox/Hoch.gif") !important; */
list-style-image: url("file:///H:/Profile/Firefox/Fx57-H-Default/chrome/icons/up.gif");
}
toolbarbutton#scrollbutton-down {
/* list-style-image: url("file:///C:/Users/Andi/Icons%20Firefox/Runter.gif") !important; */
list-style-image: url("file:///H:/Profile/Firefox/Fx57-H-Default/chrome/icons/down.gif");
}
Alles anzeigen
die für die Menüs nicht.
Die Icons dazu hast du runtergeladen?
die für die Menüs nicht.
Grml, was so ein fehlendes important doch ausmachen kann, fast erledigt.
So sieht dein Code hier aus:
Mein endgültiger Code sieht jetzt so * aus und ergibt das ** Bild.
*
#tabbrowser-arrowscrollbox {
--custom-right-image: url("file:///H:/Profile/Firefox/Fx57-H-Default/chrome/icons/rechts.png");
--custom-left-image: url("file:///H:/Profile/Firefox/Fx57-H-Default/chrome/icons/links.png");
--custom-arrow-transform: scale(1) !important;
}
#scrollbutton-down > .toolbarbutton-icon {
list-style-image: var(--custom-right-image) !important;
transform: var(--custom-arrow-transform) !important;
}
#scrollbutton-up > .toolbarbutton-icon {
list-style-image: var(--custom-left-image) !important;
transform: var(--custom-arrow-transform) !important;
}
toolbarbutton#scrollbutton-up {
list-style-image: url("file:///H:/Profile/Firefox/Fx57-H-Default/chrome/icons/up-3.png") !important;
}
toolbarbutton#scrollbutton-down {
list-style-image: url("file:///H:/Profile/Firefox/Fx57-H-Default/chrome/icons/down-3.png") !important;
}
Alles anzeigen
**
--
An alle Helfer richte ich ein ganz großes Dankeschön.
und ergibt
An alle Helfer
Von mir kam ja am wenigsten, aber das war wie immer gern geschehen
An alle
Prima!
Hier noch ein Vorschlag, falls es sonst jemand mal testen möchte:
Danke, der Code funktioniert prima.
Wie müsste er jetzt aussehen, wenn ich für beide Bereiche andere Icons einsetzen möchte. Habe mich schon daran versucht, aber will nicht so wirklich funktionieren.
wenn ich für beide Bereiche andere Icons einsetzen möchte.
Siehe bitte hier:
Siehe bitte hier:
O,weia, das hatte ich übersehen. Danke, Andreas, werde ich übernehmen.
O,weia, das hatte ich übersehen.
Alles ist gut
werde ich übernehmen.
Freut mich wenn du es so gebrauchen kannst.
Wie müsste er jetzt aussehen, wenn ich für beide Bereiche andere Icons einsetzen möchte. Habe mich schon daran versucht, aber will nicht so wirklich funktionieren.
Der Code von Andreas funktioniert hier; alternativ sollte auch sowas funktionieren:
#tabbrowser-arrowscrollbox {
--custom-right-image: url("pfeiltest-rechts.png");
--custom-left-image: url("pfeiltest-links.png");
--custom-arrow-transform: scale(1);
}
.menupopup-arrowscrollbox {
--custom-right-image: url("pfeiltest-down.png");
--custom-left-image: url("pfeiltest-up.png");
}
#scrollbutton-down > .toolbarbutton-icon {
list-style-image: var(--custom-right-image) !important;
transform: var(--custom-arrow-transform) !important;
}
#scrollbutton-up > .toolbarbutton-icon {
list-style-image: var(--custom-left-image) !important;
transform: var(--custom-arrow-transform) !important;
}
Alles anzeigen
Oder diese einfache Variante mal testen; hier muss man nur beachten, dass Firefox selber die Pfeile (Icons) intern transformiert, bzw. in der Richtung anpasst.
transform sollte man also dann nicht zusätzlich benutzen, und das Positionieren könnte im Einzelfall etwas aufwändiger sein; aber es ist simpler, und man braucht nur ein Icon nach links und eines nach unten zeigend.
#tabbrowser-arrowscrollbox {
--custom-arrow-image: url("pfeiltest-links.png");
}
.menupopup-arrowscrollbox {
--custom-arrow-image: url("pfeiltest-down.png");
}
:is(#scrollbutton-up, #scrollbutton-down) > .toolbarbutton-icon {
list-style-image: var(--custom-arrow-image) !important;
}
Alles anzeigen
Zum Testen hier noch ein paar Icons, die gehören dann - mit dem CSS von oben - direkt in den chrome Ordner.
Oder eben die url Pfade und Bilddateien nach Wunsch anpassen.