Bug 1377011 - [Photon] Update sidebar tree icons on all platforms. r=dao draft
authorNihanth Subramanya <nhnt11@gmail.com>
Thu, 29 Jun 2017 23:33:30 -0700
changeset 610588 6a0abefc7c45205c362ca07e07adf22028183d8b
parent 610234 5e73b9798464c3f7106f0161dc9a49b234f42f9c
child 637907 004ff41c1521c7a510a2fbedb9127b8fc336e632
push id68944
push usernhnt11@gmail.com
push dateTue, 18 Jul 2017 14:33:13 +0000
reviewersdao
bugs1377011
milestone56.0a1
Bug 1377011 - [Photon] Update sidebar tree icons on all platforms. r=dao MozReview-Commit-ID: 9b7VgcrtKxb
browser/themes/linux/jar.mn
browser/themes/linux/places/places.css
browser/themes/osx/places/places.css
browser/themes/shared/jar.inc.mn
browser/themes/shared/places/bookmarksMenu.svg
browser/themes/shared/places/bookmarksToolbar.svg
browser/themes/shared/places/folder-live.svg
browser/themes/shared/places/folder-smart.svg
browser/themes/shared/places/folder.svg
browser/themes/shared/places/history.svg
browser/themes/shared/places/tree-icons.inc.css
browser/themes/shared/places/unfiledBookmarks.svg
browser/themes/windows/jar.mn
browser/themes/windows/places/places.css
--- a/browser/themes/linux/jar.mn
+++ b/browser/themes/linux/jar.mn
@@ -52,17 +52,17 @@ browser.jar:
   skin/classic/browser/places/bookmarksToolbar.png    (places/bookmarksToolbar.png)
   skin/classic/browser/places/bookmarksToolbar-menuPanel.png (places/bookmarksToolbar-menuPanel.png)
   skin/classic/browser/places/bookmarks-menu-arrow.png           (places/bookmarks-menu-arrow.png)
   skin/classic/browser/places/calendar.png            (places/calendar.png)
 * skin/classic/browser/places/editBookmarkOverlay.css (places/editBookmarkOverlay.css)
   skin/classic/browser/places/livemark-item.png       (places/livemark-item.png)
   skin/classic/browser/places/starred48.png           (places/starred48.png)
   skin/classic/browser/places/unstarred48.png         (places/unstarred48.png)
-  skin/classic/browser/places/places.css              (places/places.css)
+* skin/classic/browser/places/places.css              (places/places.css)
   skin/classic/browser/places/organizer.css           (places/organizer.css)
   skin/classic/browser/places/organizer.xml           (places/organizer.xml)
   skin/classic/browser/places/query.png               (places/query.png)
   skin/classic/browser/places/tag.png                 (places/tag.png)
   skin/classic/browser/places/toolbarDropMarker.png   (places/toolbarDropMarker.png)
   skin/classic/browser/places/unsortedBookmarks.png   (places/unsortedBookmarks.png)
   skin/classic/browser/places/downloads.png           (places/downloads.png)
   skin/classic/browser/preferences/alwaysAsk.png      (preferences/alwaysAsk.png)
--- a/browser/themes/linux/places/places.css
+++ b/browser/themes/linux/places/places.css
@@ -17,106 +17,10 @@
   text-decoration: underline;
 }
 
 .sidebar-placesTreechildren::-moz-tree-cell(separator) {
   cursor: default;
 }
 
 /* Trees */
-treechildren::-moz-tree-image(title) {
-  padding-right: 2px;
-  margin: 0px 2px;
-  width: 16px;
-  height: 16px;
-  list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.svg");
-}
 
-treechildren::-moz-tree-image(title, livemarkItem) {
-  list-style-image: url("chrome://browser/skin/places/livemark-item.png");
-  -moz-image-region: rect(0px, 16px, 16px, 0px);
-}
-
-treechildren::-moz-tree-image(title, livemarkItem, visited) {
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-
-treechildren::-moz-tree-image(title, separator) {
-  list-style-image: none;
-  width: 0;
-  height: 0;
-}
-
-treechildren::-moz-tree-image(title, container) {
-  list-style-image: url("moz-icon://stock/gtk-directory?size=menu");
-}
-
-treechildren::-moz-tree-image(title, container, livemark) {
-  list-style-image: url("chrome://browser/skin/feeds/feedIcon16.png");
-  -moz-image-region: auto;
-}
-
-treechildren::-moz-tree-image(container, OrganizerQuery_AllBookmarks) {
-  list-style-image: url("chrome://browser/skin/Toolbar-small.png");
-  -moz-image-region: rect(0px 48px 16px 32px);
-}
-
-treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksToolbar) {
-  list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png");
-  -moz-image-region: auto;
-}
-
-treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksMenu) {
-  list-style-image: url("chrome://browser/skin/places/bookmarksMenu.png");
-  -moz-image-region: auto;
-}
-
-treechildren::-moz-tree-image(container, OrganizerQuery_UnfiledBookmarks) {
-  list-style-image: url("chrome://browser/skin/places/unsortedBookmarks.png");
-  -moz-image-region: auto;
-}
-
-/* query-nodes should be styled even if they're not expandable */
-treechildren::-moz-tree-image(title, query) {
-  list-style-image: url("chrome://browser/skin/places/query.png");
-}
-
-treechildren::-moz-tree-image(query, OrganizerQuery_Downloads) {
-  list-style-image: url("chrome://browser/skin/places/downloads.png");
-  -moz-image-region: auto;
-}
-
-treechildren::-moz-tree-image(title, query, tagContainer),
-treechildren::-moz-tree-image(query, OrganizerQuery_Tags) {
-  list-style-image: url("chrome://browser/skin/places/tag.png");
-}
-
-/* calendar icon for folders grouping items by date */
-treechildren::-moz-tree-image(title, query, dayContainer) {
-  list-style-image: url("chrome://browser/skin/places/calendar.png");
-}
-
-treechildren::-moz-tree-image(title, query, hostContainer) {
-  list-style-image: url("moz-icon://stock/gtk-directory?size=menu");
-}
-
-treechildren::-moz-tree-image(title, query, hostContainer, open) {
-  list-style-image: url("moz-icon://stock/gtk-directory?size=menu");
-}
-
-treechildren::-moz-tree-image(title, query, OrganizerQuery_History) {
-  list-style-image: url("chrome://browser/skin/Toolbar-small.png");
-  -moz-image-region: rect(0px 32px 16px 16px);
-}
-
-/* We want some queries to look like ordinary folders. This must come
-   after the (title, query) selector, or it would get overridden. */
-treechildren::-moz-tree-image(title, query, folder) {
-  list-style-image: url("moz-icon://stock/gtk-directory?size=menu");
-}
-
-treechildren::-moz-tree-image(cutting) {
-  opacity: 0.5;
-}
-
-treechildren::-moz-tree-cell-text(cutting) {
-  opacity: 0.7;
-}
+%include ../../shared/places/tree-icons.inc.css
--- a/browser/themes/osx/places/places.css
+++ b/browser/themes/osx/places/places.css
@@ -159,118 +159,9 @@
 }
 
 #sidebar-search-container {
   margin: 0 4px;
 }
 
 /* Trees */
 
-treechildren::-moz-tree-image(title) {
-  list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.svg");
-  padding-inline-end: 2px;
-  margin: 0px 2px;
-  width: 16px;
-  height: 16px;
-}
-
-treechildren::-moz-tree-image(title, livemarkItem) {
-  list-style-image: url("chrome://browser/skin/places/livemark-item.png");
-  -moz-image-region: rect(0px, 16px, 16px, 0px);
-}
-
-treechildren::-moz-tree-image(title, livemarkItem, visited) {
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-
-treechildren::-moz-tree-image(title, container),
-treechildren::-moz-tree-image(title, open) {
-  list-style-image: url("chrome://global/skin/tree/folder.png");
-  -moz-image-region: rect(0, 16px, 16px, 0);
-}
-
-treechildren::-moz-tree-image(title, separator) {
-  list-style-image: none;
-  width: 0 !important;
-  height: 0 !important;
-  margin: 0;
-}
-
-treechildren::-moz-tree-image(container, OrganizerQuery_AllBookmarks) {
-  list-style-image: url("chrome://browser/skin/places/allBookmarks.png");
-}
-
-treechildren::-moz-tree-image(container, livemark) {
-  list-style-image: url("chrome://browser/skin/page-livemarks.png");
-}
-
-treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksToolbar) {
-  list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png");
-}
-
-treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksMenu) {
-  list-style-image: url("chrome://browser/skin/places/bookmarksMenu.png");
-}
-
-treechildren::-moz-tree-image(container, OrganizerQuery_UnfiledBookmarks) {
-  list-style-image: url("chrome://browser/skin/places/unfiledBookmarks.png");
-}
-
-/* query-nodes should be styled even if they're not expandable */
-treechildren::-moz-tree-image(query) {
-  list-style-image: url("chrome://browser/skin/places/query.png");
-}
-
-treechildren::-moz-tree-image(query, OrganizerQuery_Downloads) {
-  list-style-image: url("chrome://browser/skin/places/downloads.png");
-}
-
-treechildren::-moz-tree-image(title, query, tagContainer),
-treechildren::-moz-tree-image(query, OrganizerQuery_Tags) {
-  list-style-image: url("chrome://browser/skin/places/tag.png");
-}
-
-/* calendar icon for folders grouping items by date */
-treechildren::-moz-tree-image(title, query, dayContainer) {
-  list-style-image: url("chrome://browser/skin/places/history.png");
-}
-
-treechildren::-moz-tree-image(title, query, hostContainer) {
-  list-style-image: url("chrome://global/skin/tree/folder.png");
-}
-
-treechildren::-moz-tree-image(title, query, hostContainer, open) {
-  list-style-image: url("chrome://global/skin/tree/folder.png");
-}
-
-treechildren::-moz-tree-image(query, OrganizerQuery_History) {
-  list-style-image: url("chrome://browser/skin/places/history.png");
-}
-
-/* We want some queries to look like ordinary folders. This must come
-   after the (title, query) selector, or it would get overridden. */
-treechildren::-moz-tree-image(title, query, folder),
-treechildren::-moz-tree-image(title, query, folder, open) {
-  list-style-image: url("chrome://global/skin/tree/folder.png");
-  -moz-image-region: rect(0, 16px, 16px, 0);
-}
-
-treechildren::-moz-tree-cell-text(title, separator) {
-  color: ThreeDShadow;
-  margin: 0px 5px;
-}
-
-treechildren::-moz-tree-cell-text(title, separator, selected, focus) {
-  color: HighlightText;
-}
-
-treechildren::-moz-tree-twisty(title, separator) {
-  -moz-appearance: none;
-  padding: 0px;
-}
-
-treechildren::-moz-tree-image(cutting) {
-  opacity: 0.5;
-}
-
-treechildren::-moz-tree-cell-text(cutting) {
-  opacity: 0.7;
-}
+%include ../../shared/places/tree-icons.inc.css
--- a/browser/themes/shared/jar.inc.mn
+++ b/browser/themes/shared/jar.inc.mn
@@ -241,16 +241,24 @@
   skin/classic/browser/panic-panel/header.png                  (../shared/panic-panel/header.png)
   skin/classic/browser/panic-panel/header@2x.png               (../shared/panic-panel/header@2x.png)
   skin/classic/browser/panic-panel/header-small.png            (../shared/panic-panel/header-small.png)
   skin/classic/browser/panic-panel/header-small@2x.png         (../shared/panic-panel/header-small@2x.png)
   skin/classic/browser/panic-panel/icons.png                   (../shared/panic-panel/icons.png)
   skin/classic/browser/panic-panel/icons@2x.png                (../shared/panic-panel/icons@2x.png)
   skin/classic/browser/places/bookmarks-notification-finish.png (../shared/places/bookmarks-notification-finish.png)
   skin/classic/browser/places/bookmarks-notification-finish@2x.png (../shared/places/bookmarks-notification-finish@2x.png)
+  skin/classic/browser/places/tree-icons.inc.css               (../shared/places/tree-icons.inc.css)
+  skin/classic/browser/places/bookmarksMenu.svg                (../shared/places/bookmarksMenu.svg)
+  skin/classic/browser/places/bookmarksToolbar.svg             (../shared/places/bookmarksToolbar.svg)
+  skin/classic/browser/places/folder.svg                       (../shared/places/folder.svg)
+  skin/classic/browser/places/folder-live.svg                  (../shared/places/folder-live.svg)
+  skin/classic/browser/places/folder-smart.svg                 (../shared/places/folder-smart.svg)
+  skin/classic/browser/places/history.svg                      (../shared/places/history.svg)
+  skin/classic/browser/places/unfiledBookmarks.svg             (../shared/places/unfiledBookmarks.svg)
   skin/classic/browser/privatebrowsing/aboutPrivateBrowsing.css (../shared/privatebrowsing/aboutPrivateBrowsing.css)
   skin/classic/browser/privatebrowsing/favicon.svg             (../shared/privatebrowsing/favicon.svg)
   skin/classic/browser/privatebrowsing/private-browsing.svg    (../shared/privatebrowsing/private-browsing.svg)
   skin/classic/browser/privatebrowsing/tracking-protection-off.svg (../shared/privatebrowsing/tracking-protection-off.svg)
   skin/classic/browser/privatebrowsing/tracking-protection.svg (../shared/privatebrowsing/tracking-protection.svg)
   skin/classic/browser/compacttheme/loading-inverted.png (../shared/compacttheme/loading-inverted.png)
   skin/classic/browser/compacttheme/loading-inverted@2x.png (../shared/compacttheme/loading-inverted@2x.png)
   skin/classic/browser/compacttheme/urlbar-history-dropmarker.svg (../shared/compacttheme/urlbar-history-dropmarker.svg)
new file mode 100644
--- /dev/null
+++ b/browser/themes/shared/places/bookmarksMenu.svg
@@ -0,0 +1,9 @@
+<!-- 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 width="16" height="16" viewBox="0 0 16 16" fill="context-fill"  xmlns="http://www.w3.org/2000/svg">
+  <path fill-opacity=".05" d="M15,2H1v12c0,0.6,0.5,1,1,1h12c0.6,0,1-0.4,1-1V2L15,2z"/>
+  <path d="M3,5v1h2V5H3z M3,9h2V8H3V9z M3,12h2v-1H3V12z"/>
+  <path fill-opacity=".9" d="M6,5v1h7V5H6z M12,8H6v1h6V8z M6,12h7v-1H6V12z"/>
+  <path d="M7,2V1H1v1v1v11c0,0.5,0.5,1,1,1h12c0.5,0,1-0.5,1-1V2H7z M13.5,14h-11C2.2,14,2,13.8,2,13.5V3h12v10.5 C14,13.8,13.8,14,13.5,14z"/>
+</svg>
new file mode 100644
--- /dev/null
+++ b/browser/themes/shared/places/bookmarksToolbar.svg
@@ -0,0 +1,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 width="16" height="16" viewBox="0 0 16 16" fill="context-fill" xmlns="http://www.w3.org/2000/svg">
+  <path fill-opacity=".15" d="M15,14H1c-0.6,0-1-0.4-1-1V3c0-0.5,0.4-1,1-1h14c0.6,0,1,0.5,1,1v10C16,13.6,15.6,14,15,14z"/>
+  <path d="M8.4,4.2l1,2.1l2.3,0.3c0.3,0,0.5,0.4,0.2,0.7l-1.7,1.7l0.4,2.4c0.1,0.3-0.3,0.6-0.6,0.4L8,10.8L6,12 c-0.3,0.1-0.6-0.1-0.6-0.4l0.4-2.4L4.1,7.4C3.9,7.2,4,6.8,4.3,6.7l2.3-0.3l1-2.1C7.8,3.9,8.2,3.9,8.4,4.2z"/>
+  <path d="M15,2H1C0.5,2,0,2.5,0,3v10c0,0.5,0.5,1,1,1h14c0.5,0,1-0.5,1-1V3C16,2.5,15.5,2,15,2z M15,12.5 c0,0.3-0.2,0.5-0.5,0.5h-13C1.2,13,1,12.8,1,12.5v-9C1,3.2,1.2,3,1.5,3h13C14.8,3,15,3.2,15,3.5V12.5z"/>
+</svg>
new file mode 100644
--- /dev/null
+++ b/browser/themes/shared/places/folder-live.svg
@@ -0,0 +1,6 @@
+<!-- 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="16" height="16" viewBox="0 0 16 16">
+  <path fill="context-fill" d="M3.5,10A2.5,2.5,0,1,0,6,12.5,2.5,2.5,0,0,0,3.5,10ZM2,1A1,1,0,0,0,2,3,10.883,10.883,0,0,1,13,14a1,1,0,0,0,2,0A12.862,12.862,0,0,0,2,1ZM2,5A1,1,0,0,0,2,7a6.926,6.926,0,0,1,7,7,1,1,0,0,0,2,0A8.9,8.9,0,0,0,2,5Z"/>
+</svg>
new file mode 100644
--- /dev/null
+++ b/browser/themes/shared/places/folder-smart.svg
@@ -0,0 +1,6 @@
+<!-- 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="16" height="16" viewBox="0 0 16 16">
+  <path fill="context-fill" d="M14,7H12.9a4.967,4.967,0,0,0-.732-1.753l.782-.783A1,1,0,1,0,11.535,3.05l-.782.783A4.968,4.968,0,0,0,9,3.1V2A1,1,0,0,0,7,2V3.1a4.968,4.968,0,0,0-1.753.732L4.464,3.05A1,1,0,0,0,3.05,4.464l.783.783A4.968,4.968,0,0,0,3.1,7H2A1,1,0,0,0,2,9H3.1a4.968,4.968,0,0,0,.732,1.753l-.783.782a1,1,0,1,0,1.414,1.414l.783-.782A4.967,4.967,0,0,0,7,12.9V14a1,1,0,0,0,2,0V12.9a4.968,4.968,0,0,0,1.753-.732l.782.782a1,1,0,0,0,1.414-1.414l-.782-.782A4.968,4.968,0,0,0,12.9,9H14a1,1,0,0,0,0-2ZM8,11a3,3,0,1,1,3-3A3,3,0,0,1,8,11Z"/>
+</svg>
new file mode 100644
--- /dev/null
+++ b/browser/themes/shared/places/folder.svg
@@ -0,0 +1,10 @@
+<!-- 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 width="16" height="16" viewBox="0 0 16 16" fill="context-fill" xmlns="http://www.w3.org/2000/svg">
+  <path fill-opacity=".15" d="M5,1H1C0.4,1,0,1.4,0,2v12.1C0,14.6,0.4,15,0.9,15h14.2c0.5,0,0.9-0.4,0.9-0.9V3.9C16,3.4,15.6,3,15.1,3H7 L6.2,1.9C6.2,1.9,5.6,1,5,1L5,1z"/>
+  <path d="M4.9,2C5,2.1,5.2,2.3,5.4,2.5l0.8,1.1L6.5,4H7h7.5C14.8,4,15,4.2,15,4.5v9c0,0.3-0.2,0.5-0.5,0.5h-13 C1.2,14,1,13.8,1,13.5v-11C1,2.2,1.2,2,1.5,2H4.9 M5,1H1C0.4,1,0,1.4,0,2v12.1C0,14.6,0.4,15,0.9,15h14.2c0.5,0,0.9-0.4,0.9-0.9V3.9 C16,3.4,15.6,3,15.1,3H7L6.2,1.9C6.2,1.9,5.6,1,5,1L5,1z"/>
+  <path fill-opacity=".15" d="M14,5H2C0.9,5,0,5.9,0,7v7c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1V7C16,5.9,15.1,5,14,5L14,5z"/>
+  <path fill-opacity=".15" d="M16,13H0v1c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1V13z"/>
+  <path d="M14,6c0.6,0,1,0.4,1,1v6.5c0,0.3-0.2,0.5-0.5,0.5h-13C1.2,14,1,13.8,1,13.5V7c0-0.6,0.4-1,1-1H14 M14,5H2 C0.9,5,0,5.9,0,7v7c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1V7C16,5.9,15.1,5,14,5L14,5z"/>
+</svg>
new file mode 100644
--- /dev/null
+++ b/browser/themes/shared/places/history.svg
@@ -0,0 +1,9 @@
+<!-- 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 width="16" height="16" viewBox="0 0 16 16" fill="context-fill" xmlns="http://www.w3.org/2000/svg">
+  <path fill-opacity=".15" d="M8,0a8,8,0,1,0,8,8A8,8,0,0,0,8,0ZM8,13a5,5,0,1,1,5-5A5,5,0,0,1,8,13Z"/>
+  <path d="M8,1A7,7,0,1,1,1,8,7,7,0,0,1,8,1M8,0a8,8,0,1,0,8,8A8,8,0,0,0,8,0Z"/>
+  <path fill-opacity=".25" d="M8,3A5,5,0,1,1,3,8,5,5,0,0,1,8,3M8,2a6,6,0,1,0,6,6A6,6,0,0,0,8,2Z"/>
+  <path d="M10.5,9H7V4.5a.5.5,0,0,1,1,0V8h2.5a.5.5,0,1,1,0,1Z"/>
+</svg>
new file mode 100644
--- /dev/null
+++ b/browser/themes/shared/places/tree-icons.inc.css
@@ -0,0 +1,116 @@
+/* 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/. */
+
+treechildren::-moz-tree-image(title) {
+  list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.svg");
+  padding-inline-end: 2px;
+  margin: 0 2px;
+  width: 16px;
+  height: 16px;
+}
+
+treechildren:-moz-tree-image {
+  -moz-context-properties: fill;
+  fill: -moz-FieldText;
+}
+
+treechildren:-moz-tree-image(selected,focus) {
+  fill: HighlightText;
+}
+
+treechildren::-moz-tree-image(title, livemarkItem) {
+  list-style-image: url("chrome://browser/skin/places/livemark-item.png");
+  -moz-image-region: rect(0px, 16px, 16px, 0px);
+}
+
+treechildren::-moz-tree-image(title, livemarkItem, visited) {
+  -moz-image-region: rect(0px, 32px, 16px, 16px);
+}
+
+treechildren::-moz-tree-image(title, container),
+treechildren::-moz-tree-image(title, open) {
+  list-style-image: url("chrome://browser/skin/places/folder.svg");
+}
+
+treechildren::-moz-tree-image(title, separator) {
+  list-style-image: none;
+  width: 0 !important;
+  height: 0 !important;
+  margin: 0;
+}
+
+treechildren::-moz-tree-image(container, OrganizerQuery_AllBookmarks) {
+  list-style-image: url("chrome://browser/skin/places/allBookmarks.png");
+}
+
+treechildren::-moz-tree-image(container, livemark) {
+  list-style-image: url("chrome://browser/skin/places/folder-live.svg");
+}
+
+treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksToolbar) {
+  list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.svg");
+}
+
+treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksMenu) {
+  list-style-image: url("chrome://browser/skin/places/bookmarksMenu.svg");
+}
+
+treechildren::-moz-tree-image(container, OrganizerQuery_UnfiledBookmarks) {
+  list-style-image: url("chrome://browser/skin/places/unfiledBookmarks.svg");
+}
+
+/* query-nodes should be styled even if they're not expandable */
+treechildren::-moz-tree-image(query) {
+  list-style-image: url("chrome://browser/skin/places/folder-smart.svg");
+}
+
+treechildren::-moz-tree-image(query, OrganizerQuery_Downloads) {
+  list-style-image: url("chrome://browser/skin/places/downloads.png");
+}
+
+treechildren::-moz-tree-image(title, query, tagContainer),
+treechildren::-moz-tree-image(query, OrganizerQuery_Tags) {
+  list-style-image: url("chrome://browser/skin/places/tag.png");
+}
+
+/* calendar icon for folders grouping items by date */
+treechildren::-moz-tree-image(title, query, dayContainer) {
+  list-style-image: url("chrome://browser/skin/places/history.svg");
+}
+
+treechildren::-moz-tree-image(title, query, hostContainer) {
+  list-style-image: url("chrome://browser/skin/places/folder.svg");
+}
+
+treechildren::-moz-tree-image(query, OrganizerQuery_History) {
+  list-style-image: url("chrome://browser/skin/places/history.svg");
+}
+
+/* We want some queries to look like ordinary folders. This must come
+   after the (title, query) selector, or it would get overridden. */
+treechildren::-moz-tree-image(title, query, folder) {
+  list-style-image: url("chrome://browser/skin/places/folder.svg");
+}
+
+treechildren::-moz-tree-cell-text(title, separator) {
+  color: ThreeDShadow;
+  margin: 0 5px;
+}
+
+treechildren::-moz-tree-cell-text(title, separator, selected, focus) {
+  color: HighlightText;
+}
+
+treechildren::-moz-tree-twisty(title, separator) {
+  -moz-appearance: none;
+  padding: 0;
+}
+
+treechildren::-moz-tree-image(cutting) {
+  opacity: 0.5;
+}
+
+treechildren::-moz-tree-cell-text(cutting) {
+  opacity: 0.7;
+}
new file mode 100644
--- /dev/null
+++ b/browser/themes/shared/places/unfiledBookmarks.svg
@@ -0,0 +1,9 @@
+<!-- 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 width="16" height="16" viewBox="0 0 16 16" fill="context-fill" xmlns="http://www.w3.org/2000/svg">
+  <path fill-opacity=".05" d="M12.7,1H3.3l-.2.6L.1,9,0,9.2V13a2.006,2.006,0,0,0,2,2H14a2.006,2.006,0,0,0,2-2V9.2L15.9,9l-3-7.4L12.7,1Z"/>
+  <path d="M12,2l3,7.4V13a.945.945,0,0,1-1,1H2a.945.945,0,0,1-1-1V9.4L4,2h8m.7-1H3.3L.1,9.1,0,9.2V13a2.006,2.006,0,0,0,2,2H14a2.006,2.006,0,0,0,2-2V9.2L15.9,9,12.7,1Z"/>
+  <path fill-opacity=".05" d="M14.988,9,12,2H4L.851,9H5.023A2.931,2.931,0,0,0,8,11.6,2.889,2.889,0,0,0,11.012,9Z"/>
+  <path d="M10,9A2,2,0,0,1,6,9H0v1H5.184a2.983,2.983,0,0,0,5.633,0H16V9Z"/>
+</svg>
--- a/browser/themes/windows/jar.mn
+++ b/browser/themes/windows/jar.mn
@@ -67,17 +67,17 @@ browser.jar:
   skin/classic/browser/downloads/download-glow-menuPanel-win7.png   (downloads/download-glow-menuPanel-win7.png)
   skin/classic/browser/downloads/download-notification-finish.png (downloads/download-notification-finish.png)
   skin/classic/browser/downloads/download-notification-start.png (downloads/download-notification-start.png)
 * skin/classic/browser/downloads/downloads.css                 (downloads/downloads.css)
   skin/classic/browser/feeds/feedIcon.png                      (feeds/feedIcon.png)
   skin/classic/browser/feeds/feedIcon16.png                    (feeds/feedIcon16.png)
   skin/classic/browser/feeds/subscribe.css                     (feeds/subscribe.css)
 * skin/classic/browser/newtab/newTab.css                       (newtab/newTab.css)
-  skin/classic/browser/places/places.css                       (places/places.css)
+* skin/classic/browser/places/places.css                       (places/places.css)
 * skin/classic/browser/places/organizer.css                    (places/organizer.css)
   skin/classic/browser/places/query.png                        (places/query.png)
   skin/classic/browser/places/bookmarksMenu.png                (places/bookmarksMenu.png)
   skin/classic/browser/places/bookmarksToolbar.png             (places/bookmarksToolbar.png)
   skin/classic/browser/places/bookmarksToolbar-menuPanel.png   (places/bookmarksToolbar-menuPanel.png)
   skin/classic/browser/places/calendar.png                     (places/calendar.png)
   skin/classic/browser/places/toolbarDropMarker.png            (places/toolbarDropMarker.png)
   skin/classic/browser/places/editBookmarkOverlay.css          (places/editBookmarkOverlay.css)
--- a/browser/themes/windows/places/places.css
+++ b/browser/themes/windows/places/places.css
@@ -39,128 +39,18 @@
     #history-panel,
     #tabs-panel {
       background-color: #EEF3FA;
     }
   }
 }
 
 /* Trees */
-treechildren::-moz-tree-image(title) {
-  list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.svg");
-  padding-right: 2px;
-  margin: 0px 2px;
-  width: 16px;
-  height: 16px;
-}
 
-treechildren::-moz-tree-image(title, livemarkItem) {
-  list-style-image: url("chrome://browser/skin/places/livemark-item.png");
-  -moz-image-region: rect(0px, 16px, 16px, 0px);
-}
-
-treechildren::-moz-tree-image(title, livemarkItem, visited) {
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-
-treechildren::-moz-tree-image(title, separator) {
-  list-style-image: none;
-  width: 0;
-  height: 0;
-}
-
-treechildren::-moz-tree-image(title, container) {
-  list-style-image: url("chrome://global/skin/icons/folder-item.png");
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-
-treechildren::-moz-tree-image(title, open) {
-  -moz-image-region: rect(16px, 32px, 32px, 16px);
-}
-
-treechildren::-moz-tree-image(title, container, livemark) {
-  list-style-image: url("chrome://browser/skin/livemark-folder.png");
-  -moz-image-region: auto;
-}
-
-treechildren::-moz-tree-image(container, OrganizerQuery_AllBookmarks) {
-  list-style-image: url("chrome://browser/skin/places/allBookmarks.png");
-  -moz-image-region: auto;
-}
-
-treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksToolbar) {
-  list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png");
-  -moz-image-region: auto;
-}
-
-treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksMenu) {
-  list-style-image: url("chrome://browser/skin/places/bookmarksMenu.png");
-  -moz-image-region: auto;
-}
-
-treechildren::-moz-tree-image(container, OrganizerQuery_UnfiledBookmarks) {
-  list-style-image: url("chrome://browser/skin/places/unsortedBookmarks.png");
-  -moz-image-region: auto;
-}
-
-/* query-nodes should be styled even if they're not expandable */
-treechildren::-moz-tree-image(title, query) {
-  list-style-image: url("chrome://browser/skin/places/query.png");
-  -moz-image-region: auto;
-}
-
-treechildren::-moz-tree-image(title, query, tagContainer),
-treechildren::-moz-tree-image(query, OrganizerQuery_Tags) {
-  list-style-image: url("chrome://browser/skin/places/tag.png");
-  -moz-image-region: auto;
-}
-
-treechildren::-moz-tree-image(query, OrganizerQuery_Downloads) {
-  list-style-image: url("chrome://browser/skin/places/downloads.png");
-  -moz-image-region: auto;
-}
-
-/* calendar icon for folders grouping items by date */
-treechildren::-moz-tree-image(title, query, dayContainer) {
-  list-style-image: url("chrome://browser/skin/places/calendar.png");
-  -moz-image-region: auto;
-}
-
-treechildren::-moz-tree-image(title, query, hostContainer) {
-  list-style-image: url("chrome://global/skin/icons/folder-item.png");
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-
-treechildren::-moz-tree-image(title, query, hostContainer, open) {
-  list-style-image: url("chrome://global/skin/icons/folder-item.png");
-  -moz-image-region: rect(16px, 32px, 32px, 16px);
-}
-
-treechildren::-moz-tree-image(title, query, OrganizerQuery_History) {
-  list-style-image: url("chrome://browser/skin/places/history.png");
-}
-
-/* We want some queries to look like ordinary folders. This must come
-   after the (title, query) selector, or it would get overridden. */
-treechildren::-moz-tree-image(title, query, folder) {
-  list-style-image: url("chrome://global/skin/icons/folder-item.png");
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-
-treechildren::-moz-tree-image(title, query, folder, open) {
-  -moz-image-region: rect(16px, 32px, 32px, 16px);
-}
-
-treechildren::-moz-tree-image(cutting) {
-  opacity: 0.5;
-}
-
-treechildren::-moz-tree-cell-text(cutting) {
-  opacity: 0.7;
-}
+%include ../../shared/places/tree-icons.inc.css
 
 /* Browser Sidebars */
 
 /* Default button vert. margins are 1px/2px, and this can cause misalignment */
 #viewButton {
   margin-top: 2px;
   margin-bottom: 2px;
 }