JSFiddle - React, Tailwind, and code Playground

by Lalji Tadhani

HTML

<div class="navbar-header navbarnone">
                <button type="button" class="navbar-toggler-icon navbarbutton" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
            </div>
            <div class="navbar-collapse collapse">
                <ul class="navbar-nav mr-auto">
                    <li class="nav-item active">
                        <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" asp-controller="X" asp-action="Index">X</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" asp-controller="x" asp-action="Index">x</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" asp-controller="X" asp-action="Privacy">x</a>
                    </li>
                    <partial name="_LoginPartial" />
                </ul>
            </div>

CSS

@media screen and (min-width: 768px) {
    .navbarnone {
        display: none;
    }
}