<nav
  class="navbar navbar-expand bg-white shadow mb-4 topbar static-top navbar-light"
  aria-label="navbar1"
>
  <div class="container-fluid">
    <button
      class="btn btn-link d-md-none rounded-circle me-3"
      id="sidebarToggleTop"
      type="button"
    >
      <i class="fas fa-bars"></i>
    </button>
    <!-- TODO: make the search work -->
    <form
      class="d-none d-sm-inline-block me-auto ms-md-3 my-2 my-md-0 mw-100 navbar-search"
      action="/search"
      method="post"
    >
      <div class="input-group">
        <input
          class="bg-light form-control border-0 small"
          type="text"
          placeholder="Search for subjects..."
        /><button class="btn btn-primary py-0" type="button">
          <i class="fas fa-search"></i>
        </button>
      </div>
    </form>
    <ul class="navbar-nav flex-nowrap ms-auto">
      <li class="nav-item dropdown no-arrow">
        <div class="nav-item dropdown no-arrow">
          <a
            class="dropdown-toggle nav-link"
            aria-expanded="false"
            data-bs-toggle="dropdown"
            href="/"
            ><span class="d-none d-lg-inline me-2 text-gray-600 small">
              <%- user.Username %>
            </span>
            <img
              class="border rounded-circle img-profile"
              alt="user image"
              src="images/avatars/avatar5.jpeg"
            />
          </a>
          <div class="dropdown-menu shadow dropdown-menu-end animated--grow-in">
            <a class="dropdown-item" href="/profile"
              ><i class="fas fa-user fa-sm fa-fw me-2 text-gray-400"></i
              >&nbsp;Profile</a
            ><a class="dropdown-item" href="/settings"
              ><i class="fas fa-cogs fa-sm fa-fw me-2 text-gray-400"></i
              >&nbsp;Settings</a
            ><a class="dropdown-item" href="#log"
              ><i class="fas fa-list fa-sm fa-fw me-2 text-gray-400"></i>&nbsp;
              Attendance Log</a
            >
            <div class="dropdown-divider"></div>
            <a class="dropdown-item" href="/logout"
              ><i class="fas fa-sign-out-alt fa-sm fa-fw me-2 text-gray-400"></i
              >&nbsp;Logout</a
            >
          </div>
        </div>
      </li>
    </ul>
  </div>
</nav>
