Bug 1502989 - Port bug 1485599 to TB: Color sidebar scrollbars according to sidebar properties. r=jorgk
authorRichard Marti <richard.marti@gmail.com>
Sun, 28 Oct 2018 12:22:13 +0100
changeset 32761 aeb3c8697c6ac316c9ecb71e03ab0b1fae704bbf
parent 32760 50073ff4e729fd9577957ad8ad2d7b71b8bb0dfc
child 32762 0f116c762e79e2d8236cf7e914104e6fb2a8b3f4
push id2343
push userclokep@gmail.com
push dateMon, 10 Dec 2018 21:37:21 +0000
treeherdercomm-beta@a0750c375f71 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersjorgk
bugs1502989, 1485599
Bug 1502989 - Port bug 1485599 to TB: Color sidebar scrollbars according to sidebar properties. r=jorgk
mail/components/im/themes/chat.css
mail/themes/linux/mail/addrbook/addressbook.css
mail/themes/linux/mail/mailWindow1.css
mail/themes/osx/mail/addrbook/addressbook.css
mail/themes/osx/mail/mailWindow1.css
mail/themes/windows/mail/addrbook/addressbook.css
mail/themes/windows/mail/mailWindow1.css
--- a/mail/components/im/themes/chat.css
+++ b/mail/components/im/themes/chat.css
@@ -72,20 +72,22 @@
   border-inline-end: 1px solid var(--imbox-selected-border-color);
 }
 
 :root[lwt-tree] #listPaneBox {
   -moz-appearance:  none;
   background-color: var(--sidebar-background-color);
   border-inline-end-color: var(--sidebar-border-color, hsla(0,0%,60%,.4));
   color: var(--sidebar-text-color);
+  scrollbar-color: rgba(204,204,204,.5) rgba(230,230,235,.5);
 }
 
 :root[lwt-tree-brighttext] #listPaneBox {
   border-inline-end-color: var(--sidebar-border-color, rgba(249,249,250,.2));
+  scrollbar-color: rgba(249,249,250,.4) rgba(20,20,25,.3);
 }
 
 #contactlistbox {
   color: inherit;
   margin: 0;
   /* make it possible to let the children overwrite the end border.
      margin-inline-start because of the inverted direction */
   margin-inline-start: -1px;
--- a/mail/themes/linux/mail/addrbook/addressbook.css
+++ b/mail/themes/linux/mail/addrbook/addressbook.css
@@ -31,16 +31,21 @@
 }
 
 #dirTree:not(:-moz-lwtheme) {
   border-bottom: 1px solid ThreeDShadow;
 }
 
 :root[lwt-tree] #dirTree {
   background-color: var(--sidebar-background-color);
+  scrollbar-color: rgba(204,204,204,.5) rgba(230,230,235,.5);
+}
+
+:root[lwt-tree-brighttext] #dirTree {
+  scrollbar-color: rgba(249,249,250,.4) rgba(20,20,25,.3);
 }
 
 :root[lwt-tree] #dirTree treechildren::-moz-tree-image,
 :root[lwt-tree] #dirTree treechildren::-moz-tree-twisty,
 :root[lwt-tree] #dirTree treechildren::-moz-tree-cell-text {
   color: var(--sidebar-text-color);
 }
 
--- a/mail/themes/linux/mail/mailWindow1.css
+++ b/mail/themes/linux/mail/mailWindow1.css
@@ -63,16 +63,24 @@ treechildren::-moz-tree-cell-text(dummy)
 }
 
 :root[lwt-tree] #folderTree,
 :root[lwt-tree] #folderPane-toolbar {
   background-color: var(--sidebar-background-color);
   color: var(--sidebar-text-color);
 }
 
+:root[lwt-tree] #folderTree {
+  scrollbar-color: rgba(204,204,204,.5) rgba(230,230,235,.5);
+}
+
+:root[lwt-tree-brighttext] #folderTree {
+  scrollbar-color: rgba(249,249,250,.4) rgba(20,20,25,.3);
+}
+
 :root[lwt-tree] #folderPane-toolbar {
   border-bottom-color: var(--sidebar-border-color, hsla(0,0%,60%,.4));
 }
 
 :root[lwt-tree-brighttext] #folderPane-toolbar {
   border-bottom-color: var(--sidebar-border-color, rgba(249,249,250,.2));
 }
 
--- a/mail/themes/osx/mail/addrbook/addressbook.css
+++ b/mail/themes/osx/mail/addrbook/addressbook.css
@@ -99,16 +99,21 @@
   treechildren::-moz-tree-image(DirCol, IsRemote-true, IsSecure-true) {
     list-style-image: url("chrome://messenger/skin/addressbook/icons/addressbook@2x.png");
     -moz-image-region: rect(0px 128px 32px 96px);
   }
 }
 
 :root[lwt-tree] #dirTree {
   background-color: var(--sidebar-background-color);
+  scrollbar-color: rgba(249,249,250,.4) rgba(20,20,25,.3);
+}
+
+:root[lwt-tree-brighttext] #dirTree {
+  scrollbar-color: rgba(249,249,250,.4) rgba(20,20,25,.3);
 }
 
 :root[lwt-tree] #dirTree treechildren::-moz-tree-image,
 :root[lwt-tree] #dirTree treechildren::-moz-tree-twisty,
 :root[lwt-tree] #dirTree treechildren::-moz-tree-cell-text {
   color: var(--sidebar-text-color);
 }
 
--- a/mail/themes/osx/mail/mailWindow1.css
+++ b/mail/themes/osx/mail/mailWindow1.css
@@ -84,16 +84,24 @@
 }
 
 :root[lwt-tree] #folderTree,
 :root[lwt-tree] #folderPane-toolbar {
   background: var(--sidebar-background-color);
   color: var(--sidebar-text-color);
 }
 
+:root[lwt-tree] #folderTree {
+  scrollbar-color: rgba(204,204,204,.5) rgba(230,230,235,.5);
+}
+
+:root[lwt-tree-brighttext] #folderTree {
+  scrollbar-color: rgba(249,249,250,.4) rgba(20,20,25,.3);
+}
+
 :root[lwt-tree] #folderPane-toolbar {
   border-bottom-color: var(--sidebar-border-color, hsla(0,0%,60%,.4));
 }
 
 :root[lwt-tree-brighttext] #folderPane-toolbar {
   border-bottom-color: var(--sidebar-border-color, rgba(249,249,250,.2));
 }
 
--- a/mail/themes/windows/mail/addrbook/addressbook.css
+++ b/mail/themes/windows/mail/addrbook/addressbook.css
@@ -111,16 +111,21 @@ toolbox > toolbar:last-of-type {
     background-color: #f8f8f8;
     border-top: 0;
     border-bottom: 1px solid #a9b1b8;
   }
 }
 
 :root[lwt-tree] #dirTree {
   background-color: var(--sidebar-background-color);
+  scrollbar-color: rgba(249,249,250,.4) rgba(20,20,25,.3);
+}
+
+:root[lwt-tree-brighttext] #dirTree {
+  scrollbar-color: rgba(249,249,250,.4) rgba(20,20,25,.3);
 }
 
 :root[lwt-tree] #dirTree treechildren::-moz-tree-image,
 :root[lwt-tree] #dirTree treechildren::-moz-tree-twisty,
 :root[lwt-tree] #dirTree treechildren::-moz-tree-cell-text {
   color: var(--sidebar-text-color);
 }
 
--- a/mail/themes/windows/mail/mailWindow1.css
+++ b/mail/themes/windows/mail/mailWindow1.css
@@ -594,16 +594,24 @@ treechildren::-moz-tree-cell-text(dummy)
 }
 
 :root[lwt-tree] #folderTree,
 :root[lwt-tree] #folderPane-toolbar {
   background-color: var(--sidebar-background-color);
   color: var(--sidebar-text-color);
 }
 
+:root[lwt-tree] #folderTree {
+  scrollbar-color: rgba(204,204,204,.5) rgba(230,230,235,.5);
+}
+
+:root[lwt-tree-brighttext] #folderTree {
+  scrollbar-color: rgba(249,249,250,.4) rgba(20,20,25,.3);
+}
+
 :root[lwt-tree] #folderPane-toolbar {
   border-bottom-color: var(--sidebar-border-color, hsla(0,0%,60%,.4));
 }
 
 :root[lwt-tree-brighttext] #folderPane-toolbar {
   border-bottom-color: var(--sidebar-border-color, rgba(249,249,250,.2));
   --toolbarbutton-hover-background: rgba(255, 255, 255, .25);
   --toolbarbutton-hover-bordercolor: rgba(255, 255, 255, .5);