Bug 1322430 - Clean up toolbar button margin and padding rules. r=gijs
☠☠ backed out by ac2a2ae05c70 ☠ ☠
authorDão Gottwald <dao@mozilla.com>
Fri, 09 Dec 2016 20:30:16 +0100
changeset 325604 ab6e6111f9171562bf35d69e02c8c101186524cd
parent 325603 f21fb9477b1606467418bc63a2ebf6a5c6991476
child 325605 53cf106dd90cfcfd2b920571e789ffbeee55b651
push id24
push usermaklebus@msu.edu
push dateTue, 20 Dec 2016 03:11:33 +0000
reviewersgijs
bugs1322430
milestone53.0a1
Bug 1322430 - Clean up toolbar button margin and padding rules. r=gijs
browser/themes/osx/browser.css
--- a/browser/themes/osx/browser.css
+++ b/browser/themes/osx/browser.css
@@ -172,16 +172,17 @@
 #navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(#nav-bar):not(#addon-bar)[collapsed=true] {
   min-height: 0.1px;
   max-height: 0;
   transition: min-height 170ms ease-out, max-height 170ms ease-out, visibility 170ms linear;
 }
 
 #nav-bar {
   -moz-appearance: none;
+  padding: 4px;
   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
      with the tabbar and we don't want to repaint it when animating tabs.
      The noise image is at least 100px high, so repeating it only horizontally
@@ -234,20 +235,16 @@
     z-index: 1;
   }
 
   #main-window[tabsintitlebar] #TabsToolbar:not([collapsed="true"]) + #nav-bar:-moz-window-inactive:not(:-moz-lwtheme) {
     border-top-color: hsla(0,0%,0%,.05);
   }
 }
 
-#nav-bar-customization-target {
-  padding: 4px;
-}
-
 #PersonalToolbar {
   padding: 0 4px 4px;
 }
 
 #PersonalToolbar:not([collapsed=true]) {
   /* 4px padding ^  plus 19px personal-bookmarks (see below) */
   min-height: 23px;
 }
@@ -672,31 +669,23 @@ toolbar .toolbarbutton-1[checked]:not(:a
   background-color: var(--toolbarbutton-checkedhover-backgroundcolor);
   transition: background-color 250ms;
 }
 
 .toolbarbutton-1[type="menu-button"]:not([overflowedItem=true]) {
   padding: 0;
 }
 
-toolbar .toolbarbutton-1[type="menu-button"] {
-  margin: 0;
-}
-
 .toolbarbutton-1 > .toolbarbutton-menubutton-button,
 .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
   margin: 0;
 }
 
 .toolbarbutton-1 {
-  margin: 0 4px;
-}
-
-toolbar .toolbarbutton-1:not([type="menu-button"]) {
-  margin: 0 2px;
+  margin: 4px 2px;
 }
 
 /**
  * Draw seperators before toolbar button dropmarkers, as well as between
  * consecutive toolbarbutton-1's within a toolbaritem.
  */
 toolbar .toolbaritem-combined-buttons:not(:hover) > separator,
 toolbar .toolbarbutton-1:not(:hover):not(:active):not([open]) > .toolbarbutton-menubutton-dropmarker::before {
@@ -721,34 +710,25 @@ toolbar .toolbarbutton-1 > .toolbarbutto
   -moz-box-orient: horizontal;
 }
 
 toolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
 toolbar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
   margin: 0 4px;
 }
 
-#nav-bar .toolbarbutton-1:not(#back-button):not(#forward-button) {
-  margin-top: 4px;
-  margin-bottom: 4px;
-}
-
-#nav-bar #PanelUI-button {
+#PanelUI-button {
+  margin-top: -4px;
+  margin-bottom: -4px;
+  margin-inline-start: 5px;
+  margin-inline-end: 1px;
+  padding-inline-start: 5px;
   -moz-box-align: center;
 }
 
-#nav-bar #PanelUI-menu-button {
-  margin-top: 0;
-  margin-bottom: 0;
-  padding-top: 1px;
-  padding-bottom: 1px;
-  margin-inline-start: 7px;
-  margin-inline-end: 7px;
-}
-
 %include ../shared/toolbarbuttons.inc.css
 %include ../shared/menupanel.inc.css
 
 @media not all and (min-resolution: 1.1dppx) {
   #back-button:hover:active:not([disabled="true"]) {
     -moz-image-region: rect(18px, 36px, 36px, 18px);
   }
 
@@ -1143,16 +1123,18 @@ toolbar .toolbarbutton-1 > .toolbarbutto
 /* Common back and forward button styles */
 
 #back-button,
 #forward-button {
   background: linear-gradient(rgba(255,255,255,0.5),
                               rgba(255,255,255,0.2) 50%,
                               rgba(255,255,255,0.1) 50%,
                               rgba(255,255,255,0.2)) repeat-x;
+  margin-top: 0;
+  margin-bottom: 0;
 }
 
 #back-button:-moz-lwtheme,
 #forward-button:-moz-lwtheme {
   background-origin: border-box;
   border: 1px solid rgba(0,0,0,0.4);
   box-shadow: inset 0 1px rgba(255,255,255,0.3), 0 1px rgba(255,255,255,0.2);
 }