Bug 1379052 - Fix [attention] styling in unpinned tabs. r?daleharvey
MozReview-Commit-ID: 5fte5vknFZ3
--- a/browser/themes/shared/compacttheme.inc.css
+++ b/browser/themes/shared/compacttheme.inc.css
@@ -265,32 +265,16 @@ window:not([chromehidden~="toolbar"]) #u
background-color: rgba(255,255,255,.3);
}
/* Use smaller back button icon */
#back-button {
list-style-image: url("chrome://browser/skin/back.svg");
}
-.tabbrowser-tab:-moz-any([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]),
-.tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
-%ifdef MOZ_PHOTON_THEME
- background-position: center bottom -4px;
-%else
- background-image: var(--pinned-tab-glow);
- background-position: center;
- background-size: 100%;
-%endif
-}
-
-.tabbrowser-tab[image] > .tab-stack > .tab-content[attention]:not([pinned]):not([selected="true"]) {
- background-position: left bottom var(--tab-toolbar-navbar-overlap);
- background-size: 34px 100%;
-}
-
.tab-throbber[selected][progress] {
list-style-image: url("chrome://browser/skin/compacttheme/loading-inverted.png");
}
@media (min-resolution: 1.1dppx) {
.tab-throbber[selected][progress] {
list-style-image: url("chrome://browser/skin/compacttheme/loading-inverted@2x.png");
}
--- a/browser/themes/shared/tabs.inc.css
+++ b/browser/themes/shared/tabs.inc.css
@@ -353,28 +353,31 @@
height: 100%;
position: absolute;
}
.tabbrowser-tab:-moz-any([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]),
.tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
%ifdef MOZ_PHOTON_THEME
background-image: url(chrome://browser/skin/tabbrowser/indicator-tab-attention.svg);
- background-position: center bottom -3px;
+ background-position: center bottom calc(-4px + var(--tab-toolbar-navbar-overlap));
%else
background-image: radial-gradient(farthest-corner at center bottom, rgb(255,255,255) 3%, rgba(186,221,251,0.75) 20%, rgba(127,179,255,0.25) 40%, transparent 70%);
background-position: center bottom var(--tab-toolbar-navbar-overlap);
background-size: 85% 100%;
%endif
background-repeat: no-repeat;
}
.tabbrowser-tab[image] > .tab-stack > .tab-content[attention]:not([pinned]):not([selected="true"]) {
- background-position: left bottom var(--tab-toolbar-navbar-overlap);
- background-size: 34px 100%;
+ background-position-x: left 11px;
+}
+
+.tabbrowser-tab[image] > .tab-stack > .tab-content[attention]:not([pinned]):not([selected="true"]):-moz-locale-dir(rtl) {
+ background-position-x: right 11px;
}
.tab-label[attention]:not([selected="true"]) {
font-weight: bold;
}
/* Tab separators */