JSFiddle - React, Tailwind, and code Playground

by greenpeace

HTML

<link rel="stylesheet" href="https://storage.googleapis.com/gpes-static/acuiferos/assets/css/app.css" />
<link rel="stylesheet" href="https://storage.googleapis.com/gpes-static/acuiferos/assets/css/Control.Geocoder-min.css" />
<link rel="stylesheet" href="https://storage.googleapis.com/gpes-static/acuiferos/assets/css/leaflet.fullscreen-min.css" />
<link rel="stylesheet" href="https://storage.googleapis.com/gpes-static/acuiferos/assets/css/L.Control.Locate.min-min.css" />
<script src="https://greenpeace.github.io/gpes-aquiferos/assets/js/map-min.js"></script>

<!--- LEYENDA SUPERIOR -->
    <span class="leyenda_chart">
      <div class="leyenda_chart_c" style="background: #d0e8f3"></div> Buen estado
      <div class="leyenda_chart_c" style="background: #C62C2C"></div> Mal estado
      <div class="leyenda_chart_c" style="background: #333333"></div> Mal estado con prórroga más allá de 2027
      <br>

    </span>
  <!--- FIN LEYENDA SUPERIOR -->

  <!--- MAPA -->
  <div id="map"></div>
  <!--- FIN MAPA -->
  
  
  <!--- LEYENDA INFERIOR -->
  <figcaption class="figure-caption text-center small">Situación de las masas de agua subterránea según los planes de tercer ciclo de las Confederaciones hidrográficas</figcaption>

  <table class="table my-4" style="margin:0 auto;width:100%;max-width:650px;text-align:left;">

    <thead>
      <tr>
        <th class="text-left p-1">IMPACTOS</th>
        <th class="text-left p-1">DESCRIPCIÓN DEL RIESGO DE NO ALCANZAR EL OBJETIVO MEDIOAMBIENTAL</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td><span class="dot_table nutr">N</span></td>
        <td class="text-left p-1">Contaminación por nutrientes, sobre todo nitratos de abonos y excrementos de animales, por encima del límite legal (50 mg/l) o cerca del límite y con evolución ascendente.</td>
      </tr>
      <tr>
        <td><span class="dot_table lowt">L</span></td>
        <td class="text-left p-1">Descenso del nivel freático (profundidad del acuífero, volumen...