Bug 896304 - use scalable glyphs for back-/ forward-buttons and the looking glass on the findbar for OSX. r=dao
authorMike de Boer <mdeboer@mozilla.com>
Fri, 29 Apr 2016 13:32:04 +0200
changeset 295303 a446f11619bc4a7108ac7354ec3ff479b29b5cf7
parent 295302 f98e3add979e3b2eba6461fdaed2cfc80961ff6f
child 295304 cf7cf5c420c7d4e977454cf6a8495986bf9a3613
push id18994
push usermdeboer@mozilla.com
push dateFri, 29 Apr 2016 12:33:44 +0000
treeherderfx-team@a446f11619bc [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdao
bugs896304
milestone49.0a1
Bug 896304 - use scalable glyphs for back-/ forward-buttons and the looking glass on the findbar for OSX. r=dao
toolkit/themes/osx/global/findBar.css
toolkit/themes/osx/global/icons/find-arrows.png
toolkit/themes/osx/global/icons/find-arrows.svg
toolkit/themes/osx/global/icons/search-textbox.png
toolkit/themes/osx/global/icons/search-textbox.svg
toolkit/themes/osx/global/jar.mn
--- a/toolkit/themes/osx/global/findBar.css
+++ b/toolkit/themes/osx/global/findBar.css
@@ -131,17 +131,17 @@ label.findbar-find-fast:-moz-lwtheme,
 /* Search field */
 
 .findbar-textbox {
   position: relative;
   -moz-appearance: none;
   border: @roundButtonBorder@;
   border-radius: 10000px 0 0 10000px;
   box-shadow: @roundButtonShadow@;
-  background: url("chrome://global/skin/icons/search-textbox.png") -moz-Field no-repeat 5px center;
+  background: url("chrome://global/skin/icons/search-textbox.svg") -moz-Field no-repeat 5px center;
   margin: 0;
   padding: 2px 8px;
   -moz-padding-start: 19px;
 }
 
 .findbar-textbox:-moz-locale-dir(rtl) {
   border-radius: 0 10000px 10000px 0;
 }
@@ -180,35 +180,34 @@ label.findbar-find-fast:-moz-lwtheme,
   -moz-margin-start: 5px;
 }
 
 /* Find previous/next buttons */
 
 .findbar-find-previous,
 .findbar-find-next {
   -moz-margin-start: 0;
-  list-style-image: url(chrome://global/skin/icons/find-arrows.png);
-  padding: 2px 6px;
+  padding: 3px 6px 1px;
 }
 
 .findbar-find-previous > .toolbarbutton-icon,
 .findbar-find-next > .toolbarbutton-icon {
   margin: 0;
 }
 
 .findbar-find-previous {
   border-left: none;
   border-right: none;
   -moz-margin-end: 0;
-  -moz-image-region: rect(0, 10px, 9px, 0);
+  list-style-image: url(chrome://global/skin/icons/find-arrows.svg#glyph-find-previous);
   border-radius: 0;
 }
 
 .findbar-find-next {
-  -moz-image-region: rect(0, 20px, 9px, 10px);
+  list-style-image: url(chrome://global/skin/icons/find-arrows.svg#glyph-find-next);
   -moz-padding-end: 7px;
 }
 
 .findbar-find-next:-moz-locale-dir(ltr) {
   border-top-left-radius: 0;
   border-bottom-left-radius: 0;
 }
 
deleted file mode 100644
index c399ed485600027b7d7c378809678b71553da3f1..0000000000000000000000000000000000000000
GIT binary patch
literal 0
Hc$@<O00001
new file mode 100644
--- /dev/null
+++ b/toolkit/themes/osx/global/icons/find-arrows.svg
@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
+  <style>
+    path:not(:target) {
+      display: none;
+    }
+    path {
+      fill: #4c4c4c;
+    }
+  </style>
+  <path id="glyph-find-previous" d="M5.407,1.5l-5,4.599L1.65,7.283l3.757-3.387l3.705,3.385l1.296-1.158L5.407,1.5z"/>
+  <path id="glyph-find-next" d="M5.547,8.255L0.538,3.53l1.239-1.265l3.77,3.641l3.719-3.641l1.264,1.188L5.547,8.255z"/>
+</svg>
deleted file mode 100644
index 2d27852b0a9d34c0e980d304fa8307f58cf436f6..0000000000000000000000000000000000000000
GIT binary patch
literal 0
Hc$@<O00001
new file mode 100644
--- /dev/null
+++ b/toolkit/themes/osx/global/icons/search-textbox.svg
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
+  <style>
+    path {
+      fill: #4c4c4c;
+      fill-rule: evenodd;
+    }
+  </style>
+  <path id="glyph-search" d="M11.354,10.646l-0.707.707L7.295,8A4.483,4.483,0,1,1,9,4.5,4.458,4.458,0,0,1,8,7.295ZM4.5,1A3.5,3.5,0,1,0,8,4.5,3.5,3.5,0,0,0,4.5,1Z"/>
+</svg>
--- a/toolkit/themes/osx/global/jar.mn
+++ b/toolkit/themes/osx/global/jar.mn
@@ -89,17 +89,17 @@ toolkit.jar:
   skin/classic/global/icons/chevron.png                              (icons/chevron.png)
   skin/classic/global/icons/chevron-inverted.png                     (icons/chevron-inverted.png)
   skin/classic/global/icons/chevron@2x.png                           (icons/chevron@2x.png)
   skin/classic/global/icons/chevron-inverted@2x.png                  (icons/chevron-inverted@2x.png)
   skin/classic/global/icons/checkbox.png                             (icons/checkbox.png)
   skin/classic/global/icons/checkbox@2x.png                          (icons/checkbox@2x.png)
   skin/classic/global/icons/close.png                                (icons/close.png)
   skin/classic/global/icons/close@2x.png                             (icons/close@2x.png)
-  skin/classic/global/icons/find-arrows.png                          (icons/find-arrows.png)
+  skin/classic/global/icons/find-arrows.svg                          (icons/find-arrows.svg)
   skin/classic/global/icons/glyph-dropdown.png                       (icons/glyph-dropdown.png)
   skin/classic/global/icons/glyph-dropdown@2x.png                    (icons/glyph-dropdown@2x.png)
   skin/classic/global/icons/information-16.png                       (icons/information-16.png)
   skin/classic/global/icons/information-24.png                       (icons/information-24.png)
   skin/classic/global/icons/information-32.png                       (icons/information-32.png)
   skin/classic/global/icons/information-64.png                       (icons/information-64.png)
   skin/classic/global/icons/information-large.png                    (icons/information-large.png)
   skin/classic/global/icons/loading.png                              (icons/loading.png)
@@ -108,17 +108,17 @@ toolkit.jar:
   skin/classic/global/icons/notfound.png                             (icons/notfound.png)
   skin/classic/global/icons/panebutton-active.png                    (icons/panebutton-active.png)
   skin/classic/global/icons/panebutton-inactive.png                  (icons/panebutton-inactive.png)
   skin/classic/global/icons/panel-dropmarker.png                     (icons/panel-dropmarker.png)
   skin/classic/global/icons/resizer.png                              (icons/resizer.png)
   skin/classic/global/icons/resizer@2x.png                           (icons/resizer@2x.png)
   skin/classic/global/icons/resizer-rtl.png                          (icons/resizer-rtl.png)
   skin/classic/global/icons/resizer-rtl@2x.png                       (icons/resizer-rtl@2x.png)
-  skin/classic/global/icons/search-textbox.png                       (icons/search-textbox.png)
+  skin/classic/global/icons/search-textbox.svg                       (icons/search-textbox.svg)
   skin/classic/global/icons/searchfield-cancel.svg                   (icons/searchfield-cancel.svg)
   skin/classic/global/icons/tabprompts-bgtexture.png                 (icons/tabprompts-bgtexture.png)
   skin/classic/global/icons/warning-16.png                           (icons/warning-16.png)
   skin/classic/global/icons/warning-32.png                           (icons/warning-32.png)
   skin/classic/global/icons/warning-64.png                           (icons/warning-64.png)
   skin/classic/global/icons/warning-large.png                        (icons/warning-large.png)
   skin/classic/global/icons/error-16.png                             (icons/error-16.png)
   skin/classic/global/icons/error-64.png                             (icons/error-64.png)