Bug 1523700 - Remove the outline on treechildren to stop paint artifacts. r+a=jorgk
authorRichard Marti <richard.marti@gmail.com>
Tue, 29 Jan 2019 19:46:11 +0100
changeset 33462 fb7f15d135af
parent 33461 9abb72db409c
child 33463 fac9afbc5ce3
push id2371
push usermozilla@jorgk.com
push dateFri, 08 Feb 2019 10:35:50 +0000
treeherdercomm-beta@86cb9d0c8982 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
bugs1523700
Bug 1523700 - Remove the outline on treechildren to stop paint artifacts. r+a=jorgk
mail/themes/windows/mail/messenger.css
--- a/mail/themes/windows/mail/messenger.css
+++ b/mail/themes/windows/mail/messenger.css
@@ -361,17 +361,16 @@ treechildren::-moz-tree-cell-text {
 }
 
 treechildren::-moz-tree-indentation {
   width: 12px;
 }
 
 @media (-moz-windows-default-theme) {
   treechildren {
-    --treechildren-outline: none;
     --treechildren-focusColor: rgb(123,195,255);
     --treechildren-selectedFocusColor: rgb(205,232,255);
     --treechildren-currentColor: rgb(125,162,206);
     --treechildren-hoverColor: rgb(229,243,255);
     --treechildren-selectedBorder: rgb(217,217,217);
     --treechildren-selectedBackground: rgb(217,217,217);
     --treechildren-currentFocusBorder: var(--treechildren-focusColor);
     --treechildren-selectedFocusBorder: var(--treechildren-selectedFocusColor) var(--treechildren-selectedFocusColor) rgb(165,214,255);
@@ -395,23 +394,21 @@ treechildren::-moz-tree-indentation {
     border-color: transparent;
     background-repeat: no-repeat;
     background-size: 100% 100%;
   }
 
   treechildren::-moz-tree-row(selected) {
     border-color: var(--treechildren-selectedBorder);
     background-color: var(--treechildren-selectedBackground);
-    outline: var(--treechildren-outline);
   }
 
   treechildren::-moz-tree-row(current, focus) {
     border-style: solid;
     border-color: var(--treechildren-currentFocusBorder);
-    outline: var(--treechildren-outline);
   }
 
   treechildren::-moz-tree-row(selected, focus),
   treechildren::-moz-tree-row(dropOn) {
     border-color: var(--treechildren-selectedFocusBorder);
     background-color: var(--treechildren-selectedFocusBackground);
   }
 
@@ -419,17 +416,16 @@ treechildren::-moz-tree-indentation {
     border-style: solid;
     border-color: var(--treechildren-selectedFocusCurrentBorder);
     background-color: var(--treechildren-selectedFocusCurrentBackground);
   }
 
   treechildren::-moz-tree-row(hover) {
     border-color: var(--treechildren-hoverBorder);
     background-color: var(--treechildren-hoverBackground);
-    outline: var(--treechildren-outline);
   }
 
   treechildren::-moz-tree-row(hover, current) {
     border-color: var(--treechildren-hoverCurrentBorder);
     background-image: var(--treechildren-hoverCurrentBackground);
   }
 
   treechildren::-moz-tree-row(hover, selected) {
@@ -463,17 +459,16 @@ treechildren::-moz-tree-indentation {
   treechildren::-moz-tree-cell-text(selected, focus) {
     color: -moz-DialogText;
   }
 
   @media (-moz-os-version: windows-win7),
          (-moz-os-version: windows-win8) {
     treechildren {
       --treechildren-2ndBorderColor: rgba(255,255,255,.4);
-      --treechildren-outline: 1px solid var(--treechildren-2ndBorderColor);
       --treechildren-selectedBackground: rgba(190,190,190,.4);
       --treechildren-currentFocusBorder: var(--treechildren-currentColor);
       --treechildren-selectedFocusBorder: rgb(132,172,221) var(--treechildren-2ndBorderColor) var(--treechildren-currentColor);
       --treechildren-selectedFocusBackground: rgba(131,183,249,.375);
       --treechildren-selectedFocusCurrentBorder: var(--treechildren-currentColor);
       --treechildren-selectedFocusCurrentBackground: rgba(131,183,249,.5);
       --treechildren-hoverBorder: rgb(184,214,251);
       --treechildren-hoverBackground: rgba(131,183,249,.16);
@@ -486,17 +481,16 @@ treechildren::-moz-tree-indentation {
     treechildren::-moz-tree-row(selected),
     treechildren::-moz-tree-row(dropOn),
     treechildren::-moz-tree-row(hover) {
       background-image: linear-gradient(rgba(255,255,255,.7), transparent);
     }
 
     treechildren::-moz-tree-row {
       border-radius: 3px;
-      -moz-outline-radius: 3px;
     }
   }
 }
 
 @media (-moz-windows-classic) {
   treecol[hideheader="true"],
   treecolpicker[hideheader="true"] {
     border-width: 0;
@@ -516,16 +510,17 @@ treechildren::-moz-tree-indentation {
 
 :root[lwt-tree-brighttext] treechildren::-moz-tree-row(current, focus) {
   border-color: var(--sidebar-highlight-background-color, rgba(249,249,250,.3));
 }
 
 :root[lwt-tree] treechildren::-moz-tree-row(hover) {
   background-color: hsla(0,0%,50%,.15);
   border-color: transparent;
+  background-image: none;
 }
 
 :root[lwt-tree] #threadTree treechildren::-moz-tree-row(untagged, selected),
 :root[lwt-tree]:-moz-window-inactive #threadTree treechildren::-moz-tree-row(selected),
 :root[lwt-tree] tree:not(#threadTree) treechildren::-moz-tree-row(selected) {
   border-color: var(--sidebar-highlight-background-color, hsla(0,0%,80%,.3));
   background: var(--sidebar-highlight-background-color, hsla(0,0%,80%,.3));
   outline: none;