Bug 1000700 - Use white dropmarkers on dark lwtheme on OSX and Linux; r?Gijs draft
authorScott Wu <scottcwwu@gmail.com>
Tue, 26 Apr 2016 15:56:55 +0800
changeset 373084 e6961812490d0fccf004d2448abe4bc6037ba276
parent 369957 46fe2115d46a5bb40523b8466341d8f9a26e1bdf
child 522326 eafd38d51a49ec81d7ed53799de1fd110c082462
push id19679
push userbmo:scwwu@mozilla.com
push dateTue, 31 May 2016 03:40:50 +0000
reviewersGijs
bugs1000700
milestone49.0a1
Bug 1000700 - Use white dropmarkers on dark lwtheme on OSX and Linux; r?Gijs MozReview-Commit-ID: LWz2G94Gsyd
browser/themes/linux/browser.css
browser/themes/osx/browser.css
browser/themes/osx/jar.mn
browser/themes/osx/places/folderDropArrow.png
browser/themes/osx/places/folderDropArrow@2x.png
browser/themes/shared/jar.inc.mn
browser/themes/shared/toolbarbutton-dropmarkers.png
browser/themes/shared/toolbarbutton-dropmarkers@2x.png
browser/themes/shared/toolbarbuttons.inc.css
browser/themes/windows/browser.css
--- a/browser/themes/linux/browser.css
+++ b/browser/themes/linux/browser.css
@@ -155,23 +155,27 @@ toolbarbutton.bookmark-item[open="true"]
 }
 
 /* Force the display of the label for bookmarks */
 .bookmark-item > .toolbarbutton-text,
 #personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-text {
   display: -moz-box !important;
 }
 
-.bookmark-item > .toolbarbutton-menu-dropmarker {
-  display: none;
+/* Dropmarker for folder bookmarks */
+.bookmark-item:hover > .toolbarbutton-menu-dropmarker,
+.bookmark-item[open="true"] > .toolbarbutton-menu-dropmarker{
+  -moz-image-region: rect(0, 7px, 5px, 0) !important;
 }
 
-/* Dropmarker for folder bookmarks */
-.bookmark-item[container] > .toolbarbutton-menu-dropmarker {
-  display: -moz-box !important;
+@media (min-resolution: 1.1dppx) {
+  .bookmark-item:hover > .toolbarbutton-menu-dropmarker,
+  .bookmark-item[open="true"] > .toolbarbutton-menu-dropmarker {
+    -moz-image-region: rect(0, 14px, 10px, 0) !important;
+  }
 }
 
 #bookmarks-toolbar-placeholder {
   list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png") !important;
 }
 
 toolbarpaletteitem[place="palette"] > #personal-bookmarks > #bookmarks-toolbar-placeholder,
 #personal-bookmarks[cui-areatype="menu-panel"] > #bookmarks-toolbar-placeholder {
--- a/browser/themes/osx/browser.css
+++ b/browser/themes/osx/browser.css
@@ -296,61 +296,35 @@ toolbarbutton.bookmark-item:not(.subview
   margin: 0 0 1px;
 }
 
 #personal-bookmarks[cui-areatype="toolbar"]:not([overflowedItem=true]) > #bookmarks-toolbar-placeholder {
   -moz-box-orient: horizontal;
 }
 
 .bookmark-item > .toolbarbutton-menu-dropmarker {
-  list-style-image: url("chrome://browser/skin/places/folderDropArrow.png");
-  -moz-image-region: rect(0, 7px, 5px, 0);
   margin-top: 1px;
-  margin-inline-start: 3px;
   margin-inline-end: -2px;
 }
 
-@media (min-resolution: 2dppx) {
-  .bookmark-item > .toolbarbutton-menu-dropmarker {
-    list-style-image: url("chrome://browser/skin/places/folderDropArrow@2x.png");
-    -moz-image-region: rect(0, 14px, 10px, 0);
-  }
-
-  .bookmark-item > .toolbarbutton-menu-dropmarker > .dropmarker-icon {
-    width: 7px;
-  }
-}
-
 .bookmark-item > .toolbarbutton-text,
 #personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-text {
   display: -moz-box !important; /* Force the display of the label for bookmarks */
 }
 
 toolbarbutton.bookmark-item:not(.subviewbutton):hover {
   background-color: rgba(0, 0, 0, .205);
 }
 
 toolbarbutton.bookmark-item:hover:not(.subviewbutton),
 toolbarbutton.bookmark-item[open="true"]:not(.subviewbutton) {
   color: #FFF !important;
   text-shadow: 0 1px rgba(0, 0, 0, .4) !important;
 }
 
-.bookmark-item:hover > .toolbarbutton-menu-dropmarker,
-.bookmark-item[open="true"] > .toolbarbutton-menu-dropmarker {
-  -moz-image-region: rect(5px, 7px, 10px, 0);
-}
-
-@media (min-resolution: 2dppx) {
-  .bookmark-item:hover > .toolbarbutton-menu-dropmarker,
-  .bookmark-item[open="true"] > .toolbarbutton-menu-dropmarker {
-    -moz-image-region: rect(10px, 14px, 20px, 0);
-  }
-}
-
 toolbarbutton.bookmark-item:not(.subviewbutton):active:hover,
 toolbarbutton.bookmark-item:not(.subviewbutton)[open="true"] {
   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.4);
   background-color: rgba(0, 0, 0, .5);
 }
 
 toolbarbutton.bookmark-item > menupopup {
   margin-inline-start: 3px;
@@ -1083,33 +1057,16 @@ toolbar .toolbarbutton-1 > .toolbarbutto
 
   #main-window:not([customizing]) .toolbarbutton-1:-moz-window-inactive[disabled="true"] > .toolbarbutton-icon,
   #main-window:not([customizing]) .toolbarbutton-1:-moz-window-inactive[disabled="true"] > .toolbarbutton-badge-stack > .toolbarbutton-icon,
   #main-window:not([customizing]) .toolbarbutton-1:-moz-window-inactive > .toolbarbutton-menubutton-button[disabled="true"] > .toolbarbutton-icon {
     opacity: .25;
   }
 }
 
-.toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
-.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
-  list-style-image: url(chrome://browser/skin/toolbarbutton-dropmarker.png);
-}
-
-@media (min-resolution: 2dppx) {
-  .toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
-  .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
-    list-style-image: url(chrome://browser/skin/toolbarbutton-dropmarker@2x.png);
-  }
-
-  .toolbarbutton-1 > .toolbarbutton-menu-dropmarker > .dropmarker-icon,
-  .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
-    width: 7px;
-  }
-}
-
 .toolbarbutton-1 > .toolbarbutton-menu-dropmarker {
   margin-inline-end: 1px;
 }
 
 .toolbarbutton-1 > .toolbarbutton-menubutton-button {
   border-inline-end: none !important;
 }
 
--- a/browser/themes/osx/jar.mn
+++ b/browser/themes/osx/jar.mn
@@ -114,18 +114,16 @@ browser.jar:
   skin/classic/browser/places/bookmarks-notification-finish.png  (places/bookmarks-notification-finish.png)
   skin/classic/browser/places/bookmarks-notification-finish@2x.png  (places/bookmarks-notification-finish@2x.png)
   skin/classic/browser/places/bookmarksToolbar-menuPanel.png    (places/bookmarksToolbar-menuPanel.png)
   skin/classic/browser/places/bookmarksToolbar-menuPanel@2x.png (places/bookmarksToolbar-menuPanel@2x.png)
   skin/classic/browser/places/history.png                   (places/history.png)
   skin/classic/browser/places/history@2x.png                (places/history@2x.png)
   skin/classic/browser/places/toolbar.png                   (places/toolbar.png)
   skin/classic/browser/places/toolbarDropMarker.png         (places/toolbarDropMarker.png)
-  skin/classic/browser/places/folderDropArrow.png           (places/folderDropArrow.png)
-  skin/classic/browser/places/folderDropArrow@2x.png        (places/folderDropArrow@2x.png)
   skin/classic/browser/places/editBookmarkOverlay.css       (places/editBookmarkOverlay.css)
   skin/classic/browser/places/minus.png                     (places/minus.png)
   skin/classic/browser/places/minus-active.png              (places/minus-active.png)
   skin/classic/browser/places/plus.png                      (places/plus.png)
   skin/classic/browser/places/plus-active.png               (places/plus-active.png)
   skin/classic/browser/places/starred48.png                 (places/starred48.png)
   skin/classic/browser/places/starred48@2x.png              (places/starred48@2x.png)
   skin/classic/browser/places/unstarred48.png               (places/unstarred48.png)
--- a/browser/themes/shared/jar.inc.mn
+++ b/browser/themes/shared/jar.inc.mn
@@ -48,16 +48,18 @@
   skin/classic/browser/customizableui/subView-arrow-back-inverted.png  (../shared/customizableui/subView-arrow-back-inverted.png)
   skin/classic/browser/customizableui/subView-arrow-back-inverted@2x.png  (../shared/customizableui/subView-arrow-back-inverted@2x.png)
   skin/classic/browser/customizableui/subView-arrow-back-inverted-rtl.png  (../shared/customizableui/subView-arrow-back-inverted-rtl.png)
   skin/classic/browser/customizableui/subView-arrow-back-inverted-rtl@2x.png  (../shared/customizableui/subView-arrow-back-inverted-rtl@2x.png)
   skin/classic/browser/customizableui/whimsy.png               (../shared/customizableui/whimsy.png)
   skin/classic/browser/customizableui/whimsy@2x.png            (../shared/customizableui/whimsy@2x.png)
   skin/classic/browser/downloads/contentAreaDownloadsView.css  (../shared/downloads/contentAreaDownloadsView.css)
   skin/classic/browser/drm-icon.svg                            (../shared/drm-icon.svg)
+  skin/classic/browser/toolbarbutton-dropmarkers.png           (../shared/toolbarbutton-dropmarkers.png)
+  skin/classic/browser/toolbarbutton-dropmarkers@2x.png        (../shared/toolbarbutton-dropmarkers@2x.png)
   skin/classic/browser/fullscreen/insecure.svg                 (../shared/fullscreen/insecure.svg)
   skin/classic/browser/fullscreen/secure.svg                   (../shared/fullscreen/secure.svg)
   skin/classic/browser/heartbeat-icon.svg                      (../shared/heartbeat-icon.svg)
   skin/classic/browser/heartbeat-star-lit.svg                  (../shared/heartbeat-star-lit.svg)
   skin/classic/browser/heartbeat-star-off.svg                  (../shared/heartbeat-star-off.svg)
   skin/classic/browser/identity-icon.svg                       (../shared/identity-block/identity-icon.svg)
   skin/classic/browser/identity-not-secure.svg                 (../shared/identity-block/identity-not-secure.svg)
   skin/classic/browser/identity-secure.svg                     (../shared/identity-block/identity-secure.svg)
rename from browser/themes/osx/places/folderDropArrow.png
rename to browser/themes/shared/toolbarbutton-dropmarkers.png
rename from browser/themes/osx/places/folderDropArrow@2x.png
rename to browser/themes/shared/toolbarbutton-dropmarkers@2x.png
--- a/browser/themes/shared/toolbarbuttons.inc.css
+++ b/browser/themes/shared/toolbarbuttons.inc.css
@@ -3,16 +3,36 @@
   list-style-image: url("chrome://browser/skin/Toolbar.png");
 }
 
 toolbar[brighttext] :-moz-any(@primaryToolbarButtons@),
 toolbar[brighttext] #bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
   list-style-image: url(chrome://browser/skin/Toolbar-inverted.png);
 }
 
+.bookmark-item > .toolbarbutton-menu-dropmarker,
+.toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
+.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
+  list-style-image: url(chrome://browser/skin/toolbarbutton-dropmarkers.png);
+  -moz-appearance: none !important;
+  -moz-image-region: rect(0, 7px, 5px, 0);
+}
+
+.bookmark-item:hover > .toolbarbutton-menu-dropmarker,
+.bookmark-item[open="true"] > .toolbarbutton-menu-dropmarker,
+toolbar[brighttext] .bookmark-item > .toolbarbutton-menu-dropmarker,
+toolbar[brighttext] .toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
+toolbar[brighttext] .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
+  -moz-image-region: rect(5px, 7px, 10px, 0);
+}
+
+.bookmark-item > .toolbarbutton-menu-dropmarker {
+  -moz-margin-start: 3px;
+}
+
 #back-button {
   -moz-image-region: rect(0, 36px, 18px, 18px);
 }
 
 #forward-button {
   -moz-image-region: rect(0, 72px, 18px, 54px);
 }
 
@@ -182,16 +202,37 @@ toolbar[brighttext] #bookmarks-menu-butt
     list-style-image: url("chrome://browser/skin/Toolbar@2x.png");
   }
 
   toolbar[brighttext] :-moz-any(@primaryToolbarButtons@),
   toolbar[brighttext] #bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
     list-style-image: url("chrome://browser/skin/Toolbar-inverted@2x.png");
   }
 
+  .bookmark-item > .toolbarbutton-menu-dropmarker,
+  .toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
+  .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
+    list-style-image: url(chrome://browser/skin/toolbarbutton-dropmarkers@2x.png);
+    -moz-image-region: rect(0, 14px, 10px, 0);
+  }
+
+  .bookmark-item:hover > .toolbarbutton-menu-dropmarker,
+  .bookmark-item[open="true"] > .toolbarbutton-menu-dropmarker,
+  toolbar[brighttext] .bookmark-item > .toolbarbutton-menu-dropmarker,
+  toolbar[brighttext] .toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
+  toolbar[brighttext] .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
+    -moz-image-region: rect(10px, 14px, 20px, 0);
+  }
+
+  .bookmark-item > .toolbarbutton-menu-dropmarker > .dropmarker-icon,
+  .toolbarbutton-1 > .toolbarbutton-menu-dropmarker > .dropmarker-icon,
+  .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
+    width: 7px;
+  }
+
   #back-button {
     -moz-image-region: rect(0, 72px, 36px, 36px);
   }
 
   #forward-button {
     -moz-image-region: rect(0, 144px, 36px, 108px);
   }
 
--- a/browser/themes/windows/browser.css
+++ b/browser/themes/windows/browser.css
@@ -656,26 +656,16 @@ menuitem.bookmark-item {
 #main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-icon,
 #main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-menu-dropmarker,
 #main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-menubutton-dropmarker,
 #main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
 #main-window:not([customizing]) .toolbarbutton-1 > .toolbarbutton-menubutton-button[disabled=true] > .toolbarbutton-icon {
   opacity: .4;
 }
 
-.toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
-.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
-  list-style-image: url("chrome://browser/skin/toolbarbutton-dropdown-arrow.png");
-}
-
-toolbar[brighttext] .toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
-toolbar[brighttext] .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
-  list-style-image: url("chrome://browser/skin/toolbarbutton-dropdown-arrow-inverted.png");
-}
-
 .toolbarbutton-1 > .toolbarbutton-icon,
 .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
   margin-inline-end: 0;
 }
 
 :-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1 > .toolbarbutton-icon,
 :-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1 > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon {
   max-width: 16px;