JSFiddle - React, Tailwind, and code Playground

by balintbako

HTML

<button class="nav-mobile-switch">Menu</button>
<ul class="site-nav actual-navigation">
    <li class="">blah</li>
    <li class="search-box">blah2</li>
    <li class="dropdown @loginBoxVisibility">stuff</li>
</ul>

CSS

button {
    display: block;
}
ul {
    display: none;
}

JavaScript

$('button.nav-mobile-switch').click(function () {
     $(this).hide();
     $('ul.site-nav.actual-navigation').show();
     return false;
 });

 $(document).click(function () {
     $('ul.site-nav.actual-navigation').hide();
     $('button.nav-mobile-switch').show();
 });


 $('ul.site-nav.actual-navigation').click(function (e) {
     e.stopPropagation();
     return false;
 });