Bug 1018582 - Get rid of #navigator-toolbox::before and #TabsToolbar::after on OS X. r=MattN
authorDão Gottwald <dao@mozilla.com>
Fri, 06 Jun 2014 08:53:35 +0200
changeset 207487 9e18c67d243e98810236d466548191cdc42f582c
parent 207486 8ebe2f070df0a572edeab72c6148e1e93654febb
child 207488 a02f2f68fbf97ae4bf22da6ad62e602efd4f4265
push id494
push userraliiev@mozilla.com
push dateMon, 25 Aug 2014 18:42:16 +0000
treeherdermozilla-release@a3cc3e46b571 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersMattN
bugs1018582
milestone32.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1018582 - Get rid of #navigator-toolbox::before and #TabsToolbar::after on OS X. r=MattN
browser/themes/osx/browser.css
--- a/browser/themes/osx/browser.css
+++ b/browser/themes/osx/browser.css
@@ -104,22 +104,16 @@ toolbarseparator {
   min-height: 22px;
 }
 
 #navigator-toolbox > toolbar:not(#TabsToolbar):not(#nav-bar):not(:-moz-lwtheme) {
   -moz-appearance: none;
   background: url(chrome://browser/skin/Toolbar-background-noise.png) hsl(0,0%,83%);
 }
 
-#TabsToolbar:not([collapsed="true"]) + #nav-bar {
-  /* Position the toolbar above the bottom of background tabs */
-  position: relative;
-  z-index: 1;
-}
-
 #nav-bar {
   -moz-appearance: none;
   background: url(chrome://browser/skin/Toolbar-background-noise.png),
               linear-gradient(hsl(0,0%,93%), hsl(0,0%,83%));
   background-clip: border-box;
   background-origin: border-box !important;
 
   /* Move the noise texture out of the top 1px strip because that overlaps
@@ -133,16 +127,29 @@ toolbarseparator {
 }
 
 @media (min-resolution: 2dppx) {
   #nav-bar {
     background-size: 100px 100px, auto;
   }
 }
 
+/* Draw the bottom border of the tabs toolbar when it's not using
+   -moz-appearance: toolbar. */
+#main-window:-moz-any([sizemode="fullscreen"],[customize-entered]) #TabsToolbar:not([collapsed="true"]) + #nav-bar,
+#main-window:not([tabsintitlebar]) #TabsToolbar:not([collapsed="true"]) + #nav-bar,
+#TabsToolbar:not([collapsed="true"]) + #nav-bar:-moz-lwtheme {
+  border-top: 1px solid hsla(0,0%,0%,.3);
+  background-clip: padding-box;
+  margin-top: -@tabToolbarNavbarOverlap@;
+  /* Position the toolbar above the bottom of background tabs */
+  position: relative;
+  z-index: 1;
+}
+
 #nav-bar-customization-target {
   padding: 4px;
 }
 
 #PersonalToolbar {
   padding: 0 4px 4px;
   /* 4px padding ^  plus 19px personal-bookmarks (see below) */
   min-height: 23px;
@@ -2765,76 +2772,35 @@ toolbarbutton.chevron > .toolbarbutton-m
   border: solid transparent;
   border-width: 0 11px;
 }
 
 .tabbrowser-tab:focus > .tab-stack > .tab-content > .tab-label {
   box-shadow: @focusRingShadow@;
 }
 
-/* We want the titlebar to be unified, but we still want to be able
- * to give #TabsToolbar a background. So we can't set -moz-appearance:
- * toolbar on #TabsToolbar itself. Instead, we set it on a box of the
- * right size which is put underneath #TabsToolbar.
- *
- * Because of Bug 941309, we make sure this pseudoelement always exists,
- * but we only make it visible when we need it.
- */
-#navigator-toolbox::before {
-  content: '';
-  display: block;
+#TabsToolbar {
+  -moz-appearance: none;
+  margin-bottom: -1px; /* Overlap the inner highlight at the top of the nav-bar */
+}
+
+#main-window:not([customizing]) #navigator-toolbox[inFullscreen] > #TabsToolbar:not(:-moz-lwtheme),
+#main-window:not(:-moz-any([customizing],[tabsintitlebar])) #navigator-toolbox > #TabsToolbar:not(:-moz-lwtheme) {
   -moz-appearance: toolbar;
-  height: @tabMinHeight@;
-  margin-bottom: -@tabMinHeight@;
-  visibility: hidden;
-}
-
-#main-window:not([customizing]) #navigator-toolbox[inFullscreen]:not(:-moz-lwtheme)::before,
-#main-window:not(:-moz-any([customizing],[tabsintitlebar])) #navigator-toolbox:not(:-moz-lwtheme)::before {
-  visibility: visible;
-}
-
-#TabsToolbar {
-  position: relative;
-  -moz-appearance: none;
-  background-repeat: repeat-x;
-  margin-bottom: -@tabToolbarNavbarOverlap@;
 }
 
 #TabsToolbar:not(:-moz-lwtheme) {
   color: #333;
   text-shadow: @loweredShadow@;
 }
 
-/*
- * Draw the bottom border of the tabstrip when core doesn't do it for us.
- * Because of Bug 941309, we make sure this pseudoelement always exists,
- * but we only make it visible when we need it.
- */
-#TabsToolbar::after {
-  content: '';
-  /* Because we use placeholders for window controls etc. in the tabstrip,
-   * and position those with ordinal attributes, and because our layout code
-   * expects :before/:after nodes to come first/last in the frame list,
-   * we have to reorder this element to come last, hence the
-   * ordinal group value (see bug 853415). */
-  -moz-box-ordinal-group: 1001;
-  position: absolute;
-  bottom: @tabToolbarNavbarOverlap@;
-  left: 0;
-  right: 0;
-  z-index: 0;
-  border-bottom: 1px solid hsla(0,0%,0%,.3);
-  visibility: hidden;
-}
-
-#main-window:-moz-any([sizemode="fullscreen"],[customize-entered]) #TabsToolbar::after,
-#main-window:not([tabsintitlebar]) #TabsToolbar::after,
-#TabsToolbar:-moz-lwtheme::after {
-  visibility: visible;
+@media (-moz-mac-lion-theme) {
+  #navigator-toolbox[inFullscreen] > #TabsToolbar {
+    padding-top: @spaceAboveTabbar@;
+  }
 }
 
 #tabbrowser-tabs {
   -moz-box-align: stretch;
 }
 
 .tabs-newtab-button > .toolbarbutton-icon {
   padding: 6px 0 4px;
@@ -4053,27 +4019,16 @@ menulist.translate-infobar-element > .me
 
 .statuspanel-label:-moz-locale-dir(rtl):not([mirror]),
 .statuspanel-label:-moz-locale-dir(ltr)[mirror] {
   border-left-style: solid;
   border-top-left-radius: .3em;
   margin-left: 1em;
 }
 
-/* Lion Fullscreen window styling */
-@media (-moz-mac-lion-theme) {
-  #navigator-toolbox[inFullscreen]::before {
-    /* Adjust by the full element height of #titlebar, since that element is
-     * not displayed in native full-screen.
-     * Also add the height of the tabs, since we're calculating the
-     * total height of this pseudo-element, not just the top-padding. */
-    height: calc(@tabMinHeight@ + @spaceAboveTabbar@) !important;
-  }
-}
-
 #full-screen-warning-message {
   background-image: url("chrome://browser/skin/fullscreen-darknoise.png");
   color: white;
   border-radius: 4px;
   margin-top: 30px;
   padding: 30px 50px;
   box-shadow: 0 0 2px white;
 }
@@ -4416,16 +4371,21 @@ window > chatbox {
   -moz-border-left-colors: hsla(0,0%,0%,.05) hsla(0,0%,0%,.1) hsla(0,0%,0%,.2);
 }
 
 #main-window[customize-entered] #customization-container,
 #main-window[customize-entered] #navigator-toolbox > toolbar:not(#TabsToolbar) {
   border-bottom-width: 0;
 }
 
+#main-window[customize-entered] #nav-bar {
+  border-top-left-radius: 2.5px;
+  border-top-right-radius: 2.5px;
+}
+
 /* Compensate for the border set above for this horizontal line. */
 #main-window[customize-entered] #navigator-toolbox::after {
   margin-left: 3px;
   margin-right: 3px;
 }
 
 #main-window[customize-entered] #TabsToolbar {
   background-clip: padding-box;