Render series color picker with correct theme

public/app/plugins/panel/graph/Legend/LegendSeriesItem.tsx

@@ -2,6 +2,8 @@ import React, { PureComponent } from 'react';
 import classNames from 'classnames';
 import { TimeSeries } from 'app/core/core';
 import { SeriesColorPicker } from '@grafana/ui';
+import { ThemeProvider } from 'app/core/utils/ConfigProvider';
+import { GrafanaTheme } from '@grafana/ui/';
 
 export const LEGEND_STATS = ['min', 'max', 'avg', 'current', 'total'];
 
@@ -154,8 +156,8 @@ interface LegendSeriesIconState {
   color: string;
 }
 
-function SeriesIcon(props) {
-  return <i className="fa fa-minus pointer" style={{ color: props.color }} />;
+function SeriesIcon({ color }) {
+  return <i className="fa fa-minus pointer" style={{ color }} />;
 }
 
 class LegendSeriesIcon extends PureComponent<LegendSeriesIconProps, LegendSeriesIconState> {
@@ -167,16 +169,25 @@ class LegendSeriesIcon extends PureComponent<LegendSeriesIconProps, LegendSeries
 
   render() {
     return (
+      <ThemeProvider>
+        {theme => {
+          return (
             <SeriesColorPicker
               optionalClass="graph-legend-icon"
               yaxis={this.props.yaxis}
               color={this.props.color}
               onColorChange={this.props.onColorChange}
               onToggleAxis={this.props.onToggleAxis}
+              theme={theme as GrafanaTheme}
             >
+              <span>
                 <SeriesIcon color={this.props.color} />
+              </span>
             </SeriesColorPicker>
           );
+        }}
+      </ThemeProvider>
+    );
   }
 }