diff --git a/browser/base/content/tabbrowser.xml b/browser/base/content/tabbrowser.xml index a39de196a2fd..397c65066e4c 100644 --- a/browser/base/content/tabbrowser.xml +++ b/browser/base/content/tabbrowser.xml @@ -2923,7 +2923,7 @@ - + @@ -3099,33 +3093,6 @@ this.mTabstrip._scrollButtonDown; - - null - null - null - -1 - 25 - - [1.00, 0.85, 0.80, 0.75, 0.71, 0.68, 0.65, 0.62, 0.59, 0.57, - 0.54, 0.52, 0.50, 0.47, 0.45, 0.44, 0.42, 0.40, 0.38, 0.37, - 0.35, 0.34, 0.32, 0.31, 0.30, 0.29, 0.28, 0.27, 0.26, 0.25, - 0.24, 0.23, 0.23, 0.22, 0.22, 0.21, 0.21, 0.21, 0.20, 0.20, - 0.20, 0.20, 0.20, 0.20, 0.20, 0.20, 0.19, 0.19, 0.19, 0.18, - 0.18, 0.17, 0.17, 0.16, 0.15, 0.14, 0.13, 0.11, 0.09, 0.06] - - - - - @@ -3152,54 +3119,12 @@ selected.left - scrollRect.left); } - this._stopAnimation(); - - const DEFAULT_OPACITY = .7; - var self = this; - this._animateBaseColor = - window.getComputedStyle(this._animateElement, null) - .outlineColor - .replace(/^rgb\((.*)\)$/, "rgba($1, " + DEFAULT_OPACITY + ")") - .replace(/([^, ]*)\)/, function (m0, m1) { - self._animateBaseOpacity = parseFloat(m1); - return "$opacity)"; - }); - - // start the flash timer - this._animateStep = 0; - - var outlineWidth = - Math.ceil(Math.min(this._animateElement.clientHeight, - this._animateElement.clientWidth) * .6) + "px"; - this._animateElement.style.outlineWidth = outlineWidth; - this._animateElement.style.outlineOffset = "-" + outlineWidth; - this._animateElement.style.outlineColor = "rgba(0,0,0,0)"; - this._animateElement.style.outlineStyle = "solid"; - - if (!this._animateTimer) - this._animateTimer = - Components.classes["@mozilla.org/timer;1"] - .createInstance(Components.interfaces.nsITimer); - - this._animateTimer.initWithCallback(this, this._animateDelay, - this._animateTimer.TYPE_REPEATING_SLACK); - ]]> - - - - - diff --git a/browser/themes/gnomestripe/browser/browser.css b/browser/themes/gnomestripe/browser/browser.css index acb86ee9388b..ce31a0f26325 100644 --- a/browser/themes/gnomestripe/browser/browser.css +++ b/browser/themes/gnomestripe/browser/browser.css @@ -1274,13 +1274,19 @@ tabpanels { /* Tabbrowser arrowscrollbox arrows */ .tabbrowser-arrowscrollbox > .scrollbutton-up { -moz-appearance: tab-scroll-arrow-back; - margin: 0px; + margin: 0; } .tabbrowser-arrowscrollbox > .scrollbutton-down { -moz-appearance: tab-scroll-arrow-forward; - margin: 0px; - outline-color: Highlight; + margin: 0; + -moz-transition: 1s -moz-box-shadow ease-out; + -moz-border-radius: 4px; +} + +.tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] { + -moz-box-shadow: 0 0 7px 5px Highlight inset; + -moz-transition: none; } .tabs-alltabs-button { diff --git a/browser/themes/pinstripe/browser/browser.css b/browser/themes/pinstripe/browser/browser.css index 5734f0ea16f2..d0220560187a 100644 --- a/browser/themes/pinstripe/browser/browser.css +++ b/browser/themes/pinstripe/browser/browser.css @@ -1657,7 +1657,12 @@ tabbrowser > tabbox > tabpanels { } .tabbrowser-arrowscrollbox > .scrollbutton-down { - outline-color: Highlight; + -moz-transition: 1s background-color ease-out; +} + +.tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] { + background-color: Highlight; + -moz-transition: none; } .tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-locale-dir(ltr), @@ -1678,6 +1683,7 @@ tabbrowser > tabbox > tabpanels { .tabbrowser-arrowscrollbox > .scrollbutton-down:hover { -moz-image-region: rect(0, 22px, 17px, 11px); background-color: rgba(0,0,0,0.10); + -moz-transition: none; } .tabbrowser-arrowscrollbox > .scrollbutton-up:hover:active, diff --git a/browser/themes/winstripe/browser/browser.css b/browser/themes/winstripe/browser/browser.css index 6dcfaba89cae..0fde450de42e 100644 --- a/browser/themes/winstripe/browser/browser.css +++ b/browser/themes/winstripe/browser/browser.css @@ -1409,7 +1409,12 @@ tabpanels { .tabbrowser-arrowscrollbox > .scrollbutton-down { list-style-image: url("chrome://browser/skin/tabbrowser/tab-arrow-right.png"); - outline-color: Highlight; + -moz-transition: 1s background-color ease-out; +} + +.tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] { + background-color: Highlight; + -moz-transition: none; } .tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-locale-dir(rtl),