Toolbox Buttons farbig oder Relief-artig

  • Firefox-Version
    74.0
    Betriebssystem
    Windows 10

    Hallo zusammen,
    ich suche eine Möglichkeit wie ich die Buttons in der Werkzeugleiste entweder relief-Artig darstellen kann oder wenigstens farbig hinterlegen kann, sodass sie also nicht "flach" und farblos erscheinen. Hat jemand von Euch eine Idee?
    Beste Grüße
    Thunder

  • Zur hilfreichsten Antwort springen
  • Hallo,

    es genügt erst einmal die Navigations-Symbolleiste.

    Die soll halt einfach vernünftig sichtbare Buttons haben - z.B. als Beispiel so wie hier:

    Wobei mir denr Button-Style quasi egal ist - Hauptsache man sieht einen vernünftigen Button.

    Beste Grüße

    Thunder

    Einmal editiert, zuletzt von Thunderstruck (23. März 2020 um 19:45)

  • Dann mach doch einfach einen Rahmen um die Buttons:

    CSS
    #nav-bar toolbarbutton {
        background-color: rgb(80,80,80) !important;
        border: 1px solid green !important;
        margin: 2px 0px !important;
        border-radius: 5px !important;
        }

    Das ganze in die userChrome.css

    Aussehen und Farbe kannst du dir dann ja noch anpassen.

  • Vielen Dank Grisu für den Lösungsvorschlag,

    OK, ich habe nun etwas damit expernimentiert.

    Der Rahmen hilft etwas, aber er lässt die Icons schrumpfen.

    Vergrößern der Icons über:

    CSS
    toolbar .toolbarbutton-1 {
        transform: scale(1.2, 1.2) !important;
        }

    bringt widerum die Rahmen durcheinander.

    Also wenn jemand noch eine Lösung hätte, welche "schöne" Buttons erzeugt - da wär ich dankbad dafür.

    Beste Grüße

    Dieter

  • Bei border kannst du statt solid auch groove, ridge, inset oder outset verwenden. Das sind vier unterschiedliche 3D-Effekte.

    Übersetzer für Obersorbisch und Niedersorbisch auf pontoon.mozilla.org u.a. für Firefox, Firefox für Android, Firefox für iOS, Firefox Klar/Focus für iOS und Android, Thunderbird, Pootle, Django, LibreOffice, LibreOffice Onlinehilfe, WordPress

  • Hallo nochmal,
    Jetzt muss ich doch noch etwas fragen:
    Meine Titelleiste sieht nun so aus:

    Ich weiß, dass die Farbe der Titelleiste/Menüleiste von Win 10 bestimmt wird, aber wie bekomme ich die 3 Buttons in der Titelleiste/Menüleiste wieder lesbar?
    (momentan weiß auf hellgrau)
    Ich hätte gerne eine farbige Titelleiste/Menüleiste, wenn aktiv – z.B. irgend ein blau mit weißer Beschriftung und graue Buttons darin mit schwarzen Symbolen.
    Habe das leider nicht hin bekommen…. (Mit Windows habe ich es nicht so - sorry - verwende das erst wieder seit kurzer Zeit)
    Beste Grüße
    Thunder

    3 Mal editiert, zuletzt von Thunderstruck (23. März 2020 um 19:43)

  • Ich weiß, dass die Farbe der Titelleiste von Win 10 bestimmt wird, aber wie bekomme ich die 2 Buttons in der titelleiste wieder lesbar?
    (momentan weiß auf hellgrau)

    Es handelt sich laut deinem Bildschirmfoto nicht um die Titelleiste, sondern um die Menüleiste. Wie du schon richtig geschrieben hast, lässt sich die (eigentliche) Titelleiste nicht anpassen, sondern kann lediglich die Akzentfarbe über die Systemsteuerung von Windows 10 setzen. Es sind außerdem 3 Schaltflächen und es handelt sich um die Systemschaltflächen von Windows: Verkleinern, Maximieren, Schließen. Bei ausgeblendeter Titelleiste rutschen sie in die Menüleiste und erst da lassen sie sich anpassen.

    Ich hätte gerne eine farbige titelleiste, wenn aktiv – z.B. irgend ein blau mit weißer Beschriftung und graue Buttons darin mit schwarzen Symbolen.

    Beziehst sich das wirklich auf die Titelleiste oder meinst du nicht doch die Menüleiste?

    Übersetzer für Obersorbisch und Niedersorbisch auf pontoon.mozilla.org u.a. für Firefox, Firefox für Android, Firefox für iOS, Firefox Klar/Focus für iOS und Android, Thunderbird, Pootle, Django, LibreOffice, LibreOffice Onlinehilfe, WordPress

  • 2002Andreas :

    "Schuldigen" gefunden, "Problem" gelöst :)

    Ich hatte in einem meiner CSS die #navigator-toolbox für mich angepaßt:

    CSS
    #navigator-toolbox #back-button,
    #navigator-toolbox #forward-button {
      padding-left: 2px !important;         /* war ohne neue Rahmen 4px */
      padding-right: 2px !important;        /* war 4px */
      padding-top: 2px !important;          /* war 6px */
      padding-bottom: 3px !important;       /* war 4px */
    }

    Nun gefällts mir wieder :D

    Danke für Deinen Code, mit dem ich meine #nav-bar und meine #fp-statusbar-2 aufhübschen konnte:thumbup:

    W11 Home 64bit - FF128.x

  • Hallo zusammen,

    erst einmal vielen Dank an alle für die Diskussion.

    Teste bitte mal, die Farben musst du dir dann noch anpassen:

    Coool! das ist spitze! Vielen Dank! Genau das was ich suche.

    2002Andreas :

    Ich hab das auch mal versucht - meine sind aber zu hoch :(


    Kann man die Höhe direkt beeinflussen oder soll ich suchen gehn, ob ich irgendwoanders die Leistenhöhe beeinflußt habe?

    Die Höhe kannst Du "schön" machen mit :
    Anpassen > Dichte > Kompakt

    Es handelt sich laut deinem Bildschirmfoto nicht um die Titelleiste, sondern um die Menüleiste

    Beziehst sich das wirklich auf die Titelleiste oder meinst du nicht doch die Menüleiste?

    Gemeint ist die Leiste ganz oben, welche in Windows "Titelleiste" aber in Firefox "Menüleiste" genannt ist.

    Jou - Thema erledigt würd ich sagen.

    Sehr, sehr gutes Forum hier - muss ich schon mal sagen!

    Beste Grüße

    Thunder

    Einmal editiert, zuletzt von Thunderstruck (23. März 2020 um 19:44)

  • Die Titelleiste ist was anderes als die Menüleiste. Im Firefox für Windows kannst du die Titelleiste, welche von Windows kommt, ein- oder ausblenden. Die Menüleiste ist ein reines Firefox-Element, die du auch nach belieben ein-oder ausblenden kannst.

    HP Chromebook 15a-nb0225ng, i3N-305, 8 GB LPDDR5-4800 MHz RAM (integriert), 256GB UFS, - chromeOS 126 (Stable Channel) - Linux Debian Bookworm: Firefox Nightly, Beta und Main Release (Mozilla PPA), Android 13: Firefox Nightly und Firefox (Main Release)

    Smartphone - Firefox Main Release, Firefox Nightly, Firefox Klar (Main Release)

  • Gemeint ist die Leiste ganz oben, welche in Windows "Titelleiste" aber in Firefox "Menüleiste" genannt ist.

    Das ist aber nicht das gleiche. Die Titelleiste von Windows ist nicht die Menüleiste von Firefox. Die Menüleiste von Firefox (mit Datei, Bearbeiten usw.) ist nur ganz oben, wenn die Titelleiste von Windows in Firefox ausgeblendet ist. Das ist sie standardmäßig, wie bei der Menüleiste von Firefox auch.

    Übersetzer für Obersorbisch und Niedersorbisch auf pontoon.mozilla.org u.a. für Firefox, Firefox für Android, Firefox für iOS, Firefox Klar/Focus für iOS und Android, Thunderbird, Pootle, Django, LibreOffice, LibreOffice Onlinehilfe, WordPress

  • Die Titelleiste ist was anderes als die Menüleiste. Im Firefox für Windows kannst du die Titelleiste, welche von Windows kommt, ein- oder ausblenden. Die Menüleiste ist ein reines Firefox-Element, die du auch nach belieben ein-oder ausblenden kannst.

    Vielen Dank Angel Of Darkness und Milupo für die Aufklärung....

    Tja wie gesagt - ich und Windows 10 - das passt zusammen wie Luis Trenker und eine U-Bahn. ;)

    Beste Grüße

    Thunder