JSFiddle - React, Tailwind, and code Playground

by psychomachine

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.6/semantic.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.6/semantic.min.css">
<div class="ui top attached demo menu">
    <a class="header item">
      Blah
    </a>
    <a class="right item tS">
      <i class="sidebar icon"></i>
      Menu
    </a>
  </div>


  <div class="ui bottom attached segment pushable">

    
    <div class="ui inverted labeled icon right inline vertical sidebar menu">
          <a class="item">
            <i class="home icon"></i>
            Home
          </a>
          <a class="item">
            <i class="block layout icon"></i>
            Topics
          </a>
          <a class="item">
            <i class="smile icon"></i>
            Friends
          </a>
          <a class="item">
            <i class="calendar icon"></i>
            History
          </a>
        </div>
       
    
    <div class="pusher">

      <div class="ui main text container">
        <p>stuff</p>
        </div>
      </div>

JavaScript

jQuery(document).ready(function($){

$('.ui.sidebar')
  .sidebar({
    context: $('.bottom.segment')
  })
  .sidebar('attach events', '.menu .tS')
;
    
    });