JSFiddle - React, Tailwind, and code Playground

by Сергей Тарасевич

HTML

<script src="https://adminlte.io/docs/3.1/assets/plugins/jquery/jquery.min.js"></script>
<script src="https://adminlte.io/docs/3.1/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="https://adminlte.io/docs/3.1/assets/plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js"></script>
<script src="https://adminlte.io/docs/3.1/assets/js/adminlte.min.js"></script>
<link rel="stylesheet" href="https://adminlte.io/docs/3.1/assets/plugins/fontawesome-free/css/all.min.css">
<link rel="stylesheet" href="https://adminlte.io/docs/3.1/assets/plugins/overlayScrollbars/css/OverlayScrollbars.min.css">
<link rel="stylesheet" href="https://adminlte.io/docs/3.1/assets/css/adminlte.min.css">
<ul class="nav nav-pills nav-sidebar nav-child-indent flex-column" data-widget="treeview" role="menu">

  <li class="nav-item">
    <a href="#" class="nav-link">
      <p>
        Layout
      </p>
    </a>
  </li>


  <li class="nav-item">

    <a href="#" class="nav-link">
      <p>
        Components
        <i class="right">i</i>
      </p>
    </a>

    <ul class="nav nav-treeview">
      <li class="nav-item">
        <a href="#" class="nav-link">
          <p>Main Header</p>
        </a>
      </li>
      <li class="nav-item">
        <a href="#" class="nav-link">
          <p>Plugins</p>
        </a>
      </li>
    </ul>
  </li>


  <li class="nav-item">

    <a href="#" class="nav-link">
      <p>
        JavaScript
        <i class="right">i</i>
      </p>
    </a>

    <ul class="nav nav-treeview">
      <li class="nav-item">
        <a href="#" class="nav-link">
          <p>Layout</p>
        </a>
      </li>
      <li class="nav-item">
        <a href="#" class="nav-link">
          <p>Push Menu</p>
        </a>
      </li>
      <li class="nav-item">
        <a href="#" class="nav-link">
          <p>Treeview</p>
        </a>
      </li>
      <li class="nav-item">
        <a href="#" class="nav-link">
          <p>IFrame</p>
        </a>
     ...

JavaScript

let fun = function() {
  let opt = {
    animationSpeed: 300,
    accordion: true,
    trigger: '[data-widget="treeview"]',
    expandSidebar: true
  }
  
  $('ul').Treeview(opt);
  
};




$( document ).ready(function() {
	fun();
});