Bug 1322430 - Clean up toolbar button margin and padding rules. r=gijs
authorDão Gottwald <dao@mozilla.com>
Mon, 12 Dec 2016 05:56:48 +0100
changeset 325633 8bedb73fd7ecc2968af70d8f627b59e1c746b930
parent 325632 9356d8836ca87f8efeaa17e2b6554590046c8cbf
child 325634 90dc3d44b941dc8f9f95f09098bc4bc667385e78
push id31067
push usercbook@mozilla.com
push dateMon, 12 Dec 2016 16:10:35 +0000
treeherdermozilla-central@f46f85dcfbc2 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersgijs
bugs1322430
milestone53.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 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
@@ -235,17 +236,18 @@
   }
 
   #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;
+  /* This shouldn't really be here. See bug 1322953. */
+  padding-inline-end: 4px;
 }
 
 #PersonalToolbar {
   padding: 0 4px 4px;
 }
 
 #PersonalToolbar:not([collapsed=true]) {
   /* 4px padding ^  plus 19px personal-bookmarks (see below) */
@@ -672,31 +674,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 +715,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 +1128,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);
 }