<!-- Topbar -->
<nav class="navbar navbar-expand navbar-light bg-white topbar mb-4 static-top shadow" data-nav-element >

    <!-- Sidebar Toggle (Topbar) -->
    <form class="form-inline">
        <button id="sidebarToggleTop" class="btn btn-link d-md-none rounded-circle mr-3">
            <i class="fa fa-bars"></i>
        </button>
    </form>

    <!-- End of Topbar -->

    <h1 class="h4 mb-2 text-gray-800">{% block topbar_title %}{% endblock %}</h1>

    <!-- Topbar Navbar -->
    <ul class="navbar-nav ml-auto">
        <!-- Topbar Search -->
        {% block topbar_search_input %}
        <div class="d-none d-sm-block">
            <form class="d-none d-sm-inline-block form-inline mr-auto ml-md-3 my-2 my-md-0 mw-100 navbar-search">
                <div class="input-group">
                    <input type="text" class="form-control bg-light border-0 small" placeholder="{% block topbar_search_placeholder %}{% endblock %}" aria-label="Search" aria-describedby="basic-addon2">
                    <div class="input-group-append">
                        <button class="btn btn-primary" type="button">
                            <i class="fas fa-search fa-sm"></i>
                        </button>
                    </div>
                </div>
            </form>
        </div>
        {% endblock %}
    </ul>

</nav>
<!-- End of Topbar -->