Airbnbサイトの模写をしています。bootstrapでナビバーのレスポンシブ対応にしたときにドロップダウンメニューにすることができず困っています。

bootstrapを使ってAirbnb> 引用テリンク内容ストサイトのナビバーのレスポンシブ対応がうまくいきません

ハンバーガーメニューを作ることはできますが、そのハンバーガーデザインをドロップダウンメニューに変えることができずに困っています。

ハンバーガーメニューを作る、ドロップダウンメニューを作ることはできます。しかし、ドロップダウンメニューを作った場合はレスポンシブ対応にならないので結果うまくいきません。

模写が終わった方がいればどのように作ったのか教えて頂ければ幸いです。

コード
<nav class="navbar navbar-expand-md navbar-light bg-white">
        <a class="navbar-brand" href="#">
          <img src="airbnb.logo.png" width="35" height="35" alt="logo">
        </a>
        <button class="btn dropdown-toggle" type="button"
          data-toggle="dropdown"
          data-target="#navmenu1"
          aria-controls="navmenu1"
          aria-expanded="true"
          aria-label="Toggle navigation">
        </button>
        <div class="collapse navbar-collapse" id="navmenu1">
        <div class="navbar-nav">
          <a class="nav-item nav-link" href="#">Menu#1</a>
          <a class="nav-item nav-link" href="#">Menu#2</a>
          <a class="nav-item nav-link" href="#">Menu#3</a>
        </div>
        </div>
以下はレスポンシブ対応にする前のコードです。
<img src="airbnb.logo.png" alt="logo" id="logo">
        <div class="searchform">
          <form>
            <p><input type="text" size="25" placeholder="&#xf002; 探す"></p>
          </form>
        </div>
        <div id="global-navi">
          <nav class="regular">
            <ul>
              <li class="hamburger"><a href="#menu"><i class="fas fa-angle-down"></i></a></li>
              <li><a href="">ホストを始める</a></li>
              <li><a href="">お気に入り</a></li>
              <li><a href="">旅行</a></li>
              <li><a href="">メッセージ</a></li>
              <li><a href="">ヘルプ</a></li>
              <li><a href=""><img src="taro.png" alt="icon" id="icon"></a></li>
            </ul>
          </nav>
        </div>
      </div> -->