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

  • 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