DevTools: update dark theme for components using fill, stroke

Screenshot: https://imgur.com/a/lhjvp3U

Bug: 827860
Change-Id: Ib42840136d4705bf90433e4ee308cf40417a610f
Reviewed-on: https://chromium-review.googlesource.com/1068245Reviewed-by: Andrey Lushnikov <lushnikov@chromium.org>
Commit-Queue: Andrey Lushnikov <lushnikov@chromium.org>
Cr-Commit-Position: refs/heads/master@{#560896}

third_party/blink/renderer/devtools/front_end/color_picker/spectrum.css

@@ -541,7 +541,8 @@ div.palette-preview {
     height: 100%;
 }
 
-.spectrum-contrast-line {
+.spectrum-contrast-line,
+:host-context(.-theme-with-dark-background) .spectrum-contrast-line {
     fill: none;
     stroke: white;
     opacity: 0.7;

third_party/blink/renderer/devtools/front_end/inline_editor/bezierEditor.css

@@ -56,12 +56,16 @@
 }
 
 .bezier-curve line.linear-line {
-    stroke: #eee;
+    stroke: rgb(238, 238, 238);
     stroke-width: 2;
     stroke-linecap: round;
     fill: none;
 }
 
+:host-context(.-theme-with-dark-background) .bezier-curve line.linear-line {
+    stroke: rgb(138, 138, 138);
+}
+
 .bezier-curve line.bezier-control-line {
     stroke: #9C27B0;
     stroke-width: 2;

third_party/blink/renderer/devtools/front_end/ui/UIUtils.js

@@ -1657,7 +1657,8 @@ UI.ThemeSupport = class {
     this._themeName = setting.get() || 'default';
     this._themableProperties = new Set([
       'color', 'box-shadow', 'text-shadow', 'outline-color', 'background-image', 'background-color',
-      'border-left-color', 'border-right-color', 'border-top-color', 'border-bottom-color', '-webkit-border-image'
+      'border-left-color', 'border-right-color', 'border-top-color', 'border-bottom-color', '-webkit-border-image',
+      'fill', 'stroke'
     ]);
     /** @type {!Map<string, string>} */
     this._cachedThemePatches = new Map();