JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>

<div id="container" style="min-width: 310px; height: 400px; max-width: 800px; margin: 0 auto"></div>

JavaScript

// create the chart
Highcharts.chart('container', {
    chart: {
	        backgroundColor: '#FFFFFF',
	        plotBackgroundColor: '#F0F8FF',
	        spacingTop: 0,
	        spacingLeft: 0,
	        spacingRight: 0,
	        marginTop: 0,
	        marginLeft: 100,
	        marginRight: 0,
	        animation: false,
	        zoomType: 'x',
//        events: {
//          selection: getSelection(event)
//        }, 
	        resetZoomButton: {
	            theme: {
	                display: 'none'
	            }
	        },
	        type: 'spline'
	      },
	  	series : {
			lines : {
				show : false,
				fill : true
			},
			splines : {
				show : true,
				tension : 0.4,
				lineWidth : 1,
				fill : 0.4
			},
			points : {
				radius : 0,
				show : true
			},
			shadowSize : 2
		  },
	   colors : [ "#286090", "#9cec5b" ],
	   plotOptions: {
		      spline: {
		          lineWidth: 2,
		          marker: {
		            enabled: true,
		            radius: 2
		          }
		      },
	          series: {
	            lines : {
					show : false,
					fill : true
				},
				splines : {
					show : true,
					tension : 0.4,
					lineWidth : 1,
					fill : 0.4
				},
				points : {
					radius : 0,
					show : true
				},
				shadowSize : 2,
				animation: false
	          }
	       },
	    xAxis: {
	        gridLineDashStyle: 'line',
	        gridLineColor: '#E6E6FA',
	        gridLineWidth: 1,
	        type: 'datetime',
	        labels: {
	           style: {
	               font: '8pt Trebuchet MS, Verdana, sans-serif',
	               color: '#262626'
	           },
	           rotation: -20,
	           marginBottom: 0
	          
	        },
	        title: {
	            text: '',
	            style: {
	              fontWeight: 'bold'
	            },
	            formatter: function(){
	              return "<h5><b>" + this.value + "</b></h5>";  
	            }
	        }
	     },
	     yAxis: {
	        endOnTick: false,
	        gridLineDashStyle:...