Bug 1522138 - [release 120] Fix color of arrows in trees (#7790). r=dwalsh

devtools/client/debugger/new/dist/debugger.css

@@ -1554,6 +1554,14 @@ span.img.marko {
   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);
 }

devtools/client/debugger/new/dist/vendors.css

@@ -525,6 +525,14 @@ span.img.marko {
   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);
 }

devtools/client/debugger/new/src/components/shared/Svg.css

@@ -348,6 +348,14 @@ span.img.marko {
   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);
 }