Vor/Zurück Button einheitlich gestalten

    Hallo,

    Über das Menü "Anpassen" kann man die Buttons Vor/Zurück ja "konfigurieren".
    Ich würde gern das der Vorwärts-Pfeil auch in einem Kreis abgebildet ist. Sprich, es sieht genauso aus wie der Zurück-Button.

    Allerdings habe ich über anklicken "Dichte" ja nur die Möglichkeit Touch-Normal-Kompakt. In denen man nicht den Vorwärts Button so angleichen kann (im Kreis) wie der Zurück-Button. Gibt es da noch eine Möglichkeit..?

    Hast Du schon mal was mit der userChrome.css gemacht? In diesem Beitrag ist eine Musterdatei mit vielen Erklärungen:

    Zitat

    https://www.camp-firefox.de/forum/viewtopic.php?f=16&t=122944


    Du kannst ja alles rauslöschen was Du nicht brauchst (also fast alles bis auf die Erläuterungen) und nur diesen Code reinschreiben:

    CSS
    #navigator-toolbox #forward-button .toolbarbutton-icon {
  border-radius: 50% !important;
}


    Gruß Harry

    FF aktuell, 64Bit, Linux, Manjaro mit KDE

    hmmm... Groß/Kleinschrift? Richtiger Profilordner? Beißt sich der Code mit anderem Code in der Datei? Funktioniert anderer Code in der Datei, also wird die Datei überhaupt erkannt?

    Bei mir wirkt es. Zusäzlich kann man noch hight: 28px !important; und width: 28px !important; mit angeben um die Größe anzupassen(Werte anpassen).

    Wenn Du meinen Code komplett nimmst solltest Du ein metallic-blaues Design erhalten (wie im Bild). Neustart des Browsers ist immer nötig...

    Gruß Harry

    FF aktuell, 64Bit, Linux, Manjaro mit KDE

    Es sieht jetzt bei mir so aus...


    [attachment=0]Hilfe 12.png[/attachment]

    Heißt, der linke (original) Kreis ist noch zusätzlich mit grauem Rand versehen und ist einen Tick größer als der rechte Kreis.
    Aber das ist nun wirklich verschmerzbar.

    Du hast geschrieben..."Zusäzlich kann man noch hight: 28px !important; und width: 28px !important; mit angeben um die Größe anzupassen.."

    Also noch mal "hight: 28px !important; und width: 28px !important;" in diesen Code einfügen und dann kann ich die Kreisgröße verändern..?

    Ich hatte im Code schon den Wert "border-radius: 50% !important" auf border-radius: 60% !important angehoben..hatte aber nichts bewirkt..

    Ich habe mal beide genau gleich formatiert:

    CSS
    /* Zurück-Taste und Vor-Taste: Rahmen um das Grafik-Element.
 */
#navigator-toolbox #back-button .toolbarbutton-icon,
#navigator-toolbox #forward-button .toolbarbutton-icon {
  border: 1px solid yellow !important;
  border-radius: 50% !important;
  height: 32px !important;
  width: 32px !important;
  padding: 6px !important;
}


    Werte anpassen...

    50% ist schon ein Kreis, nur weniger macht Sinn...

    Gruß Harry

    FF aktuell, 64Bit, Linux, Manjaro mit KDE

    Anstelle des vorherigen. Hierbei werden die Grafiken (.toolbarbutton-icon) in BEIDEN Buttons (#back-button und #forward-button) gleich angesprochen. Also wenn eine Angabe etwas abweichend ist, dann für beide... Und die Zeile border: mit der Farbangabe yellow kann weg oder andersfarbig.

    Du kannst die Werte ja mal etwas verändern, dann siehst Du was die tun...

    Gruß Harry

    FF aktuell, 64Bit, Linux, Manjaro mit KDE

    Also ich hab mal verschiedene Farben durchprobiert.

    Vorweg, die Größe scheint jetzt zu stimmen.
    Nur egal welche Farbe (nur die Randfarbe verändert sich) ich nehme, der Pfeil im Zurück-Button ist immer in einem weißen Feld/Untergrund, während dies nicht beim Vorwärts Button zu sehen ist. Dort ist im Untergrund immer die (hellblaue)Theme-Farbe zu sehen. Egal welchen Button ich auch betätige. Siehe...


    [attachment=0]Hilfe 2.png[/attachment]

    Also der Zurück-Pfeil mit weißem Hintergrund, Vorwärts in Theme-hellblau...
    Ich kann damit leben, oder ist das auch veränderbar. Also auch der Vorwärts Pfeil mit weißem Untergrund..?
    Oder soll das zur besseren Unterscheidung einfach so sein..?

    Ich denke da muß dann noch folgende Zeile mit hinein (innerhalb der {}):

    CSS
    background-color: red !important;


    Ich sehe daß hier nicht weil ich die Hintergrundfarben an anderer Stelle "geklaut" habe...
    Gruß Harry

    FF aktuell, 64Bit, Linux, Manjaro mit KDE

    Zitat

    Oder soll das zur besseren Unterscheidung einfach so sein..?


    Das soll so. Eigentlich. :)
    Wenn keine Möglichkeit für "vor" oder "zurück" besteht, wird die Farbe abgeblendet.

    Windows 10 | FF 62.0 (64-Bit) / FF 61.0 (64-Bit) / FF 63.0 (64-Bit)

    Falls du das tatsächlich so willst, musst du noch die Eigenschaft opacity anpassen. :)
    Hiermit musst du also noch die Styles von @HT-Frogger ergänzen:

    CSS
    opacity: 1 !important;

    Windows 10 | FF 62.0 (64-Bit) / FF 61.0 (64-Bit) / FF 63.0 (64-Bit)

    Wenn Du meine Muster-Design-Datei durchliest, verstehst Du bald wie es läuft. Ich habe da z.B. pauschal für alle Buttons wenn sie disabled sind den opacity: -Wert auf 0.65 gesetzt (0=durchsichtig, 1=masiv). Ganz durchsichtig war mit zu "dünn" und auffällig sollte es trotzdem sein. Aber weil das hier pauschal so ist, denke ich oft nicht weiter daran...

    Viel Spaß beim "schrauben", Gruß Harry

    FF aktuell, 64Bit, Linux, Manjaro mit KDE