Documentations

HTML

Nav HTML

<nav class="navbar navbar-light navbar-default">
  <div class="container-xl justify-content-start">
    <a class="navbar-brand d-flex position-relative mb-1" href="#"><img src="../assets/img/logo-light.png" class="navbar-brand-img-dark" alt="Discoverize" /><img src="../assets/img/logo-dark.png" class="navbar-brand-img-light" alt="Discoverize" /></a>

    <div class="ms-auto ps-6 navbar-end d-flex flex-row justify-content-end">
      <button class="btn btn-link p-0 ms-3 shadow-none" data-bs-toggle="modal" data-bs-target="#searchModal">
        <i class="fas fa-search"></i>
      </button>

      <button class="btn btn-link p-0 ms-3 shadow-none" data-bs-toggle="modal" data-bs-target="#userSignInModal">
        <i class="fas fa-user"></i>
      </button>

      <button class="btn-close btn-close-menu collapsed ms-3" type="button" data-bs-toggle="collapse" data-bs-target="#navbarMenu" aria-controls="navbarMenu" aria-expanded="false" aria-label="Toggle navigation">
        <span class="btn-close-icon"></span>
      </button>
    </div>

    <div class="collapse navbar-collapse" id="navbarMenu">
      <div class="mt-4 d-lg-none"></div>

      <ul class="navbar-nav mx-auto mb-2 mb-lg-0">
        <li class="nav-item nav-dropdown dropdown dropdown-hover">
          <a class="nav-link dropdown-toggle" href="#" id="navbarHome" role="button" data-bs-toggle="dropdown">Home</a>
          
          <ul class="nav-dropdown-menu dropdown-menu shadow">
            <li class="nav-dropdown-item nav-dropdown dropdown dropdown-hover">
              <a class="nav-dropdown-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown">Listing Home 1</a>
              <ul class="nav-dropdown-menu dropdown-menu shadow">
                <li class="nav-dropdown-item">
                  <a class="nav-dropdown-link" href="home-1.html">Listing Home 1</a>
                </li>

              </ul>
            </li>

            <li class="nav-dropdown-item">
              <a class="nav-dropdown-link" href="home-2.html">Listing Home 2</a>
            </li>
          
          </ul>

        </li>

        <li class="nav-item nav-dropdown dropdown dropdown-hover dropdown__mega">
          <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown">Templates</a>

          <div class="nav-dropdown-menu dropdown-menu shadow" data-bs-popper="none">
            <div class="container-xl position-relative py-4">
      
            </div>
          </div>
        </li>

      </ul>
      <!-- /.navbar-nav -->
    </div>
    <!-- /.collapse navbar-collapse -->
  </div>
  <!-- /.container-fluid -->
</nav>
HTML - Header HTML
HTML - Section HTML