JSFiddle - React, Tailwind, and code Playground

by hakan

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="comps"></div>

JavaScript

/**
 * Dark theme for Highcharts JS
 * @author Torstein Honsi
 */
// Load the fonts
Highcharts.createElement('link', {
    href: '//fonts.googleapis.com/css?family=Lato',
    rel: 'stylesheet',
    type: 'text/css'
}, null, document.getElementsByTagName('head')[0]);

Highcharts.theme = {
    colors: ["#2980B9", "#79BD8F", "#FFB155", "#E74C36", "#777777", "#ff0066", "#eeaaee", "#55BF3B", "#DF5353", "#7798BF", "#aaeeee"],
    chart: {
        backgroundColor: {
            linearGradient: {
                x1: 0,
                y1: 0,
                x2: 1,
                y2: 1
            },
            stops: [
                [0, '#fff'],
                [1, '#fff']
            ]
        },
        style: {
            fontFamily: "'Lato', sans-serif",
            fontWeight: "300"
        },
        plotBorderColor: '#606063'
    },
    title: {
        style: {
            color: '#777',
            textTransform: 'uppercase',
            fontSize: '20px'
        }
    },
    subtitle: {
        style: {
            color: '#777',
            textTransform: 'uppercase'
        }
    },
    xAxis: {
        gridLineColor: '#707073',
        labels: {
            style: {
                color: '#fff'
            }
        },
        crosshair: {
            color: "red"
        },
        lineColor: '#707073',
        minorGridLineColor: '#505053',
        tickColor: '#707073',
        title: {
            style: {
                color: '#777'

            }
        }
    },
    yAxis: {
        gridLineColor: '#707073',
        labels: {
            style: {
                color: '#777'
            }
        },
        lineColor: '#707073',
        minorGridLineColor: '#505053',
        tickColor: '#707073',
        tickWidth: 1,
        title: {
            style: {
                color: '#777'
            }
        }
    }

};

// Apply the theme
Highcharts.setOptions(Highcharts.theme);






$('#comps').highcharts({
    chart: {
        type: 'column'
...