Simple Navigation in Bermuda

Every webpage has a navigation component. Bermuda also provides the simple navigation component.

Simple Navbar

It is a very simple navabr for desktop and mobile screens. 

                    
                      <nav class="nav border-rounded-sm shadow-lg">
                        <div class="nav__logo">
                          <h2><a href=""> Bermuda</a></h2>
                        </div>
                        <ul class="nav__links">
                          <li><a class="btn btn-link" href="">Home</a></li>
                          <li><a class="btn btn-link" href="">Docs</a></li>
                          <li><a class="btn btn-link btn-disabled" href="">Contribute</a></li>
                        </ul>
                        <div class="nav__menu-btn hide">
                          <i class="fas fa-bars"></i>
                        </div>
                      </nav>

Dark Navbar

Bermuda also provides navbar with dark background just by simply adding nav__bg-dark class to nav tag. 

                    
                      <nav class="nav nav__bg-dark">
                        <div class="nav__logo">
                          <h2><a href=""> Bermuda</a></h2>
                        </div>
                        <ul class="nav__links">
                          <li><a class="btn btn-link" href="">Home</a></li>
                          <li><a class="btn btn-link" href="">Docs</a></li>
                          <li><a class="btn btn-link btn-disabled" href="">Contribute</a></li>
                        </ul>
                        <div class="nav__menu-btn hide">
                          <i class="fas fa-bars"></i>
                        </div>
                      </nav>
  List
Modal