JSFiddle - React, Tailwind, and code Playground

by schlomm

HTML

<!DOCTYPE html>
<html>
    
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />
        <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" />
        <title>forum_no toc</title>
        <link rel="stylesheet" type="text/css" href="//js.arcgis.com/3.7/js/dojo/dijit/themes/soria/soria.css">
        <link rel="stylesheet" type="text/css" href="//js.arcgis.com/3.7/js/esri/css/esri.css" />
        <link rel="stylesheet" type="text/css" href="http://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/latest/build/agsjs/css/agsjs.css" />
        <style>
            html, body {
                height: 99%;
                width: 99%;
                margin: 0;
                padding: 5px;
                font-family: helvetica, arial, sans-serif;
                font-size: 90%;
            }
            .esriBasemapGallerySelectedNode .esriBasemapGalleryThumbnail {
                border-color: #66FFFF !important;
            }
            #leftPane {
                width: 280px;
                overflow: auto
            }
            #map {
                padding:0;
            }
			#LocateButton {
			  position: absolute;
			  top: 95px;
			  left: 20px;
			  z-index: 50;
			}
            .templatePicker {
                border: none;
            }
            .dj_ie .infowindow .window .top .right .user .content {
                position: relative;
            }
            .dj_ie .simpleInfoWindow .content {
                position: relative;
            }
            /* this line hide layers when out of scale for the inline TOC */
            .agsjsTOCOutOfScale {
                /*  display: none;*/
            }
			
			<!-- Style for Titlepanes (Basemapgallery uses these-->
			#titlePane{
				width:240px;
			}
			.soria .dijitTitlePaneTitle {
				background: #808775;
				font-weight:600;
				border:solid 1px...