diff --git a/browser/base/content/browser.css b/browser/base/content/browser.css index 52de7c0cd9c0..09e7c0303701 100644 --- a/browser/base/content/browser.css +++ b/browser/base/content/browser.css @@ -122,7 +122,6 @@ tabbrowser { visibility: hidden; } -.tab-close-button, .tab-background { /* Explicitly set the visibility to override the value (collapsed) * we inherit from #TabsToolbar[collapsed] upon opening a browser window. */ @@ -131,15 +130,28 @@ tabbrowser { transition: visibility 0ms 25ms; } -.tab-close-button:not([fadein]):not([pinned]), .tab-background:not([fadein]):not([pinned]) { visibility: hidden; /* Closing tabs are hidden without a delay. */ transition-delay: 0ms; } +.tab-close-button, +.tab-label { + /* Explicitly set the visibility to override the value (collapsed) + * we inherit from #TabsToolbar[collapsed] upon opening a browser window. */ + visibility: visible; + transition: opacity 70ms 230ms, + visibility 0ms 230ms; +} + +.tab-close-button:not([fadein]):not([pinned]), +.tab-label:not([fadein]):not([pinned]) { + visibility: collapse; + opacity: .6; +} + .tab-throbber:not([fadein]):not([pinned]), -.tab-label:not([fadein]):not([pinned]), .tab-icon-image:not([fadein]):not([pinned]) { display: none; } diff --git a/browser/base/content/tabbrowser.xml b/browser/base/content/tabbrowser.xml index a91f8c1ee8cc..9fb9b0293cb0 100644 --- a/browser/base/content/tabbrowser.xml +++ b/browser/base/content/tabbrowser.xml @@ -1672,12 +1672,6 @@ // kick the animation off t.setAttribute("fadein", "true"); - - // This call to adjustTabstrip is redundant but needed so that - // when opening a second tab, the first tab's close buttons - // appears immediately rather than when the transition ends. - if (this.tabs.length - this._removingTabs.length == 2) - this.tabContainer.adjustTabstrip(); }.bind(this)); } @@ -1863,13 +1857,6 @@ aTab.style.maxWidth = ""; // ensure that fade-out transition happens aTab.removeAttribute("fadein"); - if (this.tabs.length - this._removingTabs.length == 1) { - // The second tab just got closed and we will end up with a single - // one. Remove the first tab's close button immediately (if needed) - // rather than after the tabclose animation ends. - this.tabContainer.adjustTabstrip(); - } - setTimeout(function (tab, tabbrowser) { if (tab.parentNode && window.getComputedStyle(tab).maxWidth == "0.1px") {