6. Ladezustände der Tabs
Habe eine Lösung gefunden, die mir ausreicht.
CSS
/*Tab-Aussehen verändern*/
/* TAB normal (inaktiv):
* Hintergrundfarbe, Schriftfarbe,
* Rahmen um die TABs, oben abgerundet und Abstände angepaßt,
*/
#toolbar-menubar:not([autohide=true]) ~ #TabsToolbar > #tabbrowser-tabs > .tabbrowser-tab > .tab-stack > .tab-background {
border:none!important;}
#TabsToolbar .tabbrowser-tab {
color: black !important;
border: 1px solid !important;
border-bottom: 1px solid black!important;
background: #ffffff !important; /* weiß für inaktive Tabs*/
border-radius: 5px 5px 0 0 !important;
margin: 3px 1px 1px 2px !important;
padding: 1px 0 !important;
}
/* TAB bei Mauskontakt:
* Hintergrundfarbe, Rahmen
*/
#TabsToolbar .tabbrowser-tab:hover {
color: black !important;
}
/* TAB bei bei angewähltem TAB (aktiv):
* Hintergrundfarbe, Rahmen,
* Schriftfarbe.
*/
#TabsToolbar .tabbrowser-tab[selected="true"] {
background: #fe3858 !important;
/*font-weight:bold !important;*/
color: white ! important;
}
/* Tab-Icon etwas größer,
* links weniger, unten etwas mehr Abstand zum TAB-Rand.
*/
#TabsToolbar .tab-icon-image {
height: 18px !important;
width: 18px !important;
margin-left: -2px !important;
margin-bottom: 2px !important;
}
/* Tab-Schließen-Button:
* Rechts weniger Abstand zum TAB-Rand, etwas größer,
* Textfarbe (Kreuz)
* Hintergrundfarbe, an den Eckenradius des Buttons angepaßt.
*/
#TabsToolbar .tab-close-button {
margin-right: -4px !important;
padding: 0 !important;
color: white !important;
}
#TabsToolbar .tab-close-button .toolbarbutton-icon {
height: 20px !important;
width: 20px !important;
background-color: red !important;
border-radius: 5px !important;
}
/* Tab-Schließen-Button bei angewähltem TAB (aktiv):
* Hintergrundfarbe.
*/
#TabsToolbar .tab-close-button[selected="true"] .toolbarbutton-icon {
background-color: red !important;
}
/* Alle anderen Elemente in den TABs ohne Hintergrund.
*/
#TabsToolbar .tabbrowser-tab * {
background: none !important;
}
Alles anzeigen
[Blockierte Grafik: https://www2.pic-upload.de/img/34347644/A13.jpg]
Inaktive Tabs: Weißer Hintergrund
Aktiver Tab: Roter Hintergrund