Bug 1286821 - fix devedition hidpi issue with back button icon, r=dao
authorGijs Kruitbosch <gijskruitbosch@gmail.com>
Tue, 26 Jul 2016 10:16:23 +0100
changeset 347108 4b767c8f023685e9e598f026453fbd906e0e8d1f
parent 346810 80afb86a5a171430c5d687f7fd697d809505fda3
child 347109 5f273e4bdc67570a10855cc7613d8a4aa5ad1d60
push id6389
push userraliiev@mozilla.com
push dateMon, 19 Sep 2016 13:38:22 +0000
treeherdermozilla-beta@01d67bfe6c81 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdao
bugs1286821
milestone50.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 1286821 - fix devedition hidpi issue with back button icon, r=dao MozReview-Commit-ID: EV4xMtWYAya
browser/themes/osx/devedition.css
browser/themes/shared/devedition.inc.css
browser/themes/windows/devedition.css
--- a/browser/themes/osx/devedition.css
+++ b/browser/themes/osx/devedition.css
@@ -86,20 +86,16 @@
 }
 
 #back-button:hover:active:not([disabled="true"]) {
   -moz-image-region: rect(18px, 54px, 36px, 36px);
 }
 
 /* Use smaller back button icon */
 @media (min-resolution: 2dppx) {
-  #back-button {
-    -moz-image-region: rect(0, 108px, 36px, 72px);
-  }
-
   #back-button:hover:active:not([disabled="true"]) {
     -moz-image-region: rect(36px, 108px, 72px, 72px);
   }
 }
 
 #forward-button:hover:active:not(:-moz-lwtheme) {
   background-image: none;
   box-shadow: none;
--- a/browser/themes/shared/devedition.inc.css
+++ b/browser/themes/shared/devedition.inc.css
@@ -223,16 +223,22 @@ window:not([chromehidden~="toolbar"]) #u
   padding-bottom: 0;
 }
 
 /* Use smaller back button icon */
 #back-button {
   -moz-image-region: rect(0, 54px, 18px, 36px);
 }
 
+@media (min-resolution: 1.1dppx) {
+  #back-button {
+    -moz-image-region: rect(0, 108px, 36px, 72px);
+  }
+}
+
 .tab-background {
   visibility: hidden;
 }
 
 /* Tab separators */
 .tabbrowser-tab::after,
 .tabbrowser-tab::before {
   background: currentColor;
--- a/browser/themes/windows/devedition.css
+++ b/browser/themes/windows/devedition.css
@@ -38,48 +38,38 @@
 #TabsToolbar::after {
   display: none;
 }
 
 #back-button > .toolbarbutton-icon,
 #forward-button > .toolbarbutton-icon {
   background: var(--chrome-nav-buttons-background) !important;
   border-radius: 0 !important;
-  width: auto !important;
   height: auto !important;
   padding: var(--toolbarbutton-vertical-inner-padding) 5px !important;
   margin: 0 !important;
   border: 1px solid var(--chrome-nav-bar-controls-border-color) !important;
   box-shadow: none !important;
 }
 
+#back-button > .toolbarbutton-icon {
+  /* 18px icon + 2 * 5px padding + 2 * 1px border */
+  width: 30px !important;
+}
+
+#forward-button > .toolbarbutton-icon {
+  /* 18px icon + 2 * 5px padding + 1 * 1px border */
+  width: 29px !important;
+}
+
 /* the normal theme adds box-shadow: <stuff> !important when the back-button is [open]. Fix: */
 #back-button[open="true"] > .toolbarbutton-icon {
   box-shadow: none !important;
 }
 
-/* Force 1x image for back/forward button for now, otherwise it breaks the
-   layout - Bug 1165360. */
-@media (min-resolution: 1.1dppx) {
-  #back-button,
-  #forward-button {
-    list-style-image: url("chrome://browser/skin/Toolbar.png");
-  }
-
-  toolbar[brighttext] #back-button,
-  toolbar[brighttext] #forward-button {
-    list-style-image: url("chrome://browser/skin/Toolbar-inverted.png");
-  }
-
-  /* The back button region is already set in devedition.inc.css */
-  #forward-button {
-    -moz-image-region: rect(0px, 72px, 18px, 54px);
-  }
-}
-
 #forward-button > .toolbarbutton-icon {
   border-inline-start: none !important;
 }
 
 /* Override a box shadow for disabled back button */
 #main-window:not([customizing]) #back-button[disabled] > .toolbarbutton-icon {
   box-shadow: none !important;
 }