Hover-Farbe für Tabs und "Schließen"-Button

  • Firefox-Version
    89
    Betriebssystem
    Win10

    Hallo,

    ich möchte gerne die Hover-Farbe des aktiven und inaktiven Tabs anpassen und die Hover-Farbe des auf dem Tab befindlichen "Schließen"-Buttons.

    Was ich nicht anpassen möchte: Schriftfarbe /-art /-größe etc.

    Danke für Tipps.

  • ich möchte gerne

    Teste bitte, Farben wenn dann anpassen:

  • Teste diesen CSS für close Button bitte.

    Das ist jetzt mal schnell

    CSS
    /*    Tab-Schließen, Ansicht nur wenn Aktiv - Kreuz */
    tab:not([selected]) .tab-close-button {
        display: none !important; }    
    
    /*    Tab-Schließen - Kreuz */
    .tab-close-button {
        fill:#a4000f !important; }
  • Der funktioniert schon. In Andreas Text fehlt die abschließend geschweifte Klammer, und wenn du das darunter setzt funktioniert es nicht.

    Ganzer richtiger Code:

    Hilfe auch im deutschsprachigen Matrix-Chat möglich oder im IRC-Chat
    Meine Anleitungstexte dürfen gerne "geklaut" und weiter verwendet/kopiert werden ;)

  • Wie bekomme ich die Symbole <, >, +, v, weiß? Und die Farbe für Hover "+" angepasst?

    Teste bitte:

    Die Codes stammen von hier:

    #24

  • ^ habe ich schon getestet, aber da tut sich exakt 0,0.

    Wenn ich das richtig lese, geht es da eher um den gesamten Button, als um den Text darin? (Aber auch der Button wird nicht weiß)

  • Funktioniert jetzt soweit - es hatte tatsächlich eine Klammer gefehlt.

    Was tatsächlich aber nicht geht, ist der Hover des "+" Buttons - der ist hellgrau und ich wüsste nicht, wo/wie ich den anpassen könnte?

    Bekomme ich die 3 Symbole, in der Ecke auch noch weiß?

  • Das halte ich für ein Gerücht

    Titelleiste muss dann ausgeblendet sein, dann geht das per userChrome.css.

    Nur mal so 3 gleiche Icons dafür benutzt.

    Evtl. kannst du mit dem Code ja etwas anfangen:

  • also aus dem #9 geposteten Code sind die doch weiß

    wurde doch bereits in Zeile 2-5 definiert


    Übrigens: TabsToolbar definiert die Tab-Leiste und nicht die Menüleiste, wie in deinem #9 Code kommentiert

    Hilfe auch im deutschsprachigen Matrix-Chat möglich oder im IRC-Chat
    Meine Anleitungstexte dürfen gerne "geklaut" und weiter verwendet/kopiert werden ;)

    2 Mal editiert, zuletzt von Zitronella (6. Juni 2021 um 20:42) aus folgendem Grund: Ein Beitrag von Zitronella mit diesem Beitrag zusammengefügt.

  • Apropos Hover-Farbe für "Schließen"-Button.

    Ich habe es so gelöst.

    CSS
    /*Tab schließen X hover*/
    .tab-content > .tab-close-button:hover {
        background-color:transparent !important;
        box-shadow: inset 0px 0px 25px 0px #ff3232 !important; /* Hellrot*/
    }

    Man kann dann eine gewisse "Transparenz" erzielen.

    Mit <3lichem Gruß

    Mira