Bug 1522138 - [release 120] Fix color of arrows in trees (#7790). r=dwalsh
authorDavid Walsh <davidwalsh83@gmail.com>
Thu, 24 Jan 2019 15:24:57 -0500
changeset 515392 0e402395db6c48e42d9e6851a34721614832a754
parent 515391 c2913cb9cb20bf4852b2cb5e1e3d5bf29421ba29
child 515393 cfc7aa2486d4eb6c42ba2714027465364b8a0da1
push id1953
push userffxbld-merge
push dateMon, 11 Mar 2019 12:10:20 +0000
treeherdermozilla-release@9c35dcbaa899 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdwalsh
bugs1522138
milestone66.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1522138 - [release 120] Fix color of arrows in trees (#7790). r=dwalsh
devtools/client/debugger/new/dist/debugger.css
devtools/client/debugger/new/dist/vendors.css
devtools/client/debugger/new/src/components/shared/Svg.css
--- a/devtools/client/debugger/new/dist/debugger.css
+++ b/devtools/client/debugger/new/dist/debugger.css
@@ -1549,16 +1549,24 @@ span.img.marko {
   padding-top: 9px;
   background: var(--disclosure-arrow);
   mask-size: 100%;
   display: inline-block;
   transform: rotate(-90deg);
   transition: transform 0.18s ease;
 }
 
+/* overrides tree component */
+.tree-node button.arrow {
+  background: none;
+  mask: url("resource://devtools/client/debugger/new/images/arrow.svg");
+  background: var(--disclosure-arrow);
+  mask-size: 100%;
+}
+
 html[dir="rtl"] .img.arrow {
   transform: rotate(90deg);
 }
 
 .arrow {
   transition: transform 0.125s ease;
   height: 10px;
   width: 10px;
--- a/devtools/client/debugger/new/dist/vendors.css
+++ b/devtools/client/debugger/new/dist/vendors.css
@@ -520,16 +520,24 @@ span.img.marko {
   padding-top: 9px;
   background: var(--disclosure-arrow);
   mask-size: 100%;
   display: inline-block;
   transform: rotate(-90deg);
   transition: transform 0.18s ease;
 }
 
+/* overrides tree component */
+.tree-node button.arrow {
+  background: none;
+  mask: url("resource://devtools/client/debugger/new/images/arrow.svg");
+  background: var(--disclosure-arrow);
+  mask-size: 100%;
+}
+
 html[dir="rtl"] .img.arrow {
   transform: rotate(90deg);
 }
 
 .arrow {
   transition: transform 0.125s ease;
   height: 10px;
   width: 10px;
--- a/devtools/client/debugger/new/src/components/shared/Svg.css
+++ b/devtools/client/debugger/new/src/components/shared/Svg.css
@@ -343,16 +343,24 @@ span.img.marko {
   padding-top: 9px;
   background: var(--disclosure-arrow);
   mask-size: 100%;
   display: inline-block;
   transform: rotate(-90deg);
   transition: transform 0.18s ease;
 }
 
+/* overrides tree component */
+.tree-node button.arrow {
+  background: none;
+  mask: url(/images/arrow.svg);
+  background: var(--disclosure-arrow);
+  mask-size: 100%;
+}
+
 html[dir="rtl"] .img.arrow {
   transform: rotate(90deg);
 }
 
 .arrow {
   transition: transform 0.125s ease;
   height: 10px;
   width: 10px;