JSFiddle - React, Tailwind, and code Playground

by Bryan McIntosh

HTML

<div id="bottomSheet">
  <div id="bottomSheet-touchy" data-xthreshold="100 ">
    <hr id="bottomSheet-grabber">
    <span class="pull-right">
      <i id="bs-button-small" class="bs-buttons fa-solid fa-window-minimize"></i>
      <i id="bs-button-medium" class="bs-buttons fa-solid fa-window-maximize"></i>
      <i id="bs-button-large" class="bs-buttons fa-solid fa-square"></i>
    </span>
    <span id="aside-label-map" class="aside-label">Map</span>
    <span id="aside-label-table" class="aside-label">table</span>
    <span id="aside-label-chart" class="aside-label">chart</span>
    <span id="aside-label-help" class="aside-label">help</span>
  </div>
  <!-- side area content -->
  <div id="aside-area-map" class="aside-area">
    <div class="sssss">
      <div>map stuff1</div>      <div>map stuff</div>
      <div>map stuff</div>      <div>map stuff</div>
      <div>map stuff2</div>      <div>map stuff</div>
      <div>map stuff</div>      <div>map stuff</div>
      <div>map stuff3</div>      <div>map stuff</div>
      <div>map stuff</div>      <div>map stuff</div>
      <div>map stuff4</div>      <div>map stuff</div>
      <div>map stuff</div>      <div>map stuff</div>
      <div>map stuff5</div>      <div>map stuff</div>
      <div>map stuff</div>      <div>map stuff</div>
      <div>map stuff6</div>      <div>map stuff</div>
      <div>map stuff</div>      <div>map stuff</div>
      <div>map stuff7</div>      <div>map stuff</div>
      <div>map stuff</div>      <div>map stuff</div>
      <div>map stuff8</div>      <div>map stuff</div>
      <div>map stuff</div>      <div>map stuff</div>
    </div>
  </div>
  <div id="aside-area-table" class="aside-area">aside table</div>
  <div id="aside-area-chart" class="aside-area">aside chart</div>
  <div id="aside-area-help" class="aside-area">aside help</div>

</div>

CSS

#bottomSheet {
  position: fixed;
  width: 100%;
  height: 340px;
  bottom: 400;
  background-color: rgb(153, 132, 185);
  z-index: 500; /*1001 */
  /* overflow: auto; */
}