Bug 1268498 - [Linux] [Developer Edition] The tab visual sound indicator is not visible enough using the light developer edition theme . r= Gijs.
MozReview-Commit-ID: 4JL7LWrzT6h
--- a/browser/themes/shared/devedition.inc.css
+++ b/browser/themes/shared/devedition.inc.css
@@ -288,16 +288,40 @@ window:not([chromehidden~="toolbar"]) #u
background-color: var(--tab-hover-background-color);
}
.tabbrowser-tab[visuallyselected] {
color: var(--tab-selection-color) !important; /* Override color: inherit */
background-color: var(--tab-selection-background-color);
}
+.tab-icon-sound[visuallyselected=true][soundplaying] {
+ list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white");
+}
+
+.tab-icon-sound[visuallyselected=true][soundplaying]:hover {
+ list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-hover");
+}
+
+.tab-icon-sound[visuallyselected=true][soundplaying]:hover:active {
+ list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-pressed");
+}
+
+.tab-icon-sound[visuallyselected=true][muted] {
+ list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white");
+}
+
+.tab-icon-sound[visuallyselected=true][muted]:hover {
+ list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-hover");
+}
+
+.tab-icon-sound[visuallyselected=true][muted]:hover:active {
+ list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-pressed");
+}
+
/* Don't need space for the tab curves (66px - 30px) */
.tabs-newtab-button {
width: 36px;
}
.tabs-newtab-button:hover {
/* Important needed because !important is used in browser.css */
background-color: var(--tab-hover-background-color) !important;
--- a/browser/themes/shared/tabs.inc.css
+++ b/browser/themes/shared/tabs.inc.css
@@ -171,36 +171,42 @@
.tab-icon-sound[muted]:hover {
list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-hover");
}
.tab-icon-sound[muted]:hover:active {
list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-pressed");
}
+.tab-icon-sound:-moz-lwtheme,
.tab-icon-sound[visuallyselected=true][soundplaying] {
list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio");
}
+.tab-icon-sound:hover:-moz-lwtheme,
.tab-icon-sound[visuallyselected=true][soundplaying]:hover {
list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-hover");
}
+.tab-icon-sound:hover:active:-moz-lwtheme,
.tab-icon-sound[visuallyselected=true][soundplaying]:hover:active {
list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-pressed");
}
+.tab-icon-sound[muted]:-moz-lwtheme,
.tab-icon-sound[visuallyselected=true][muted] {
list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted");
}
+.tab-icon-sound[muted]:hover:-moz-lwtheme,
.tab-icon-sound[visuallyselected=true][muted]:hover {
list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-hover");
}
+.tab-icon-sound[muted]:hover:active:-moz-lwtheme,
.tab-icon-sound[visuallyselected=true][muted]:hover:active {
list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-pressed");
}
#TabsToolbar[brighttext] .tab-icon-sound[soundplaying] {
list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white");
}