HTML Example:
<!-- START: Navbar Additional Classes: .nk-navbar-lg .nk-navbar-align-center .nk-navbar-align-right .nk-navbar-overlay-content .nk-navbar-light --> <nav class="nk-navbar nk-navbar-side nk-navbar-left nk-navbar-lg nk-navbar-align-left nk-navbar-overlay-content" id="nk-navbar-left"> <div class="nano"> <div class="nano-content"> <div class="nk-nav-table"> <div class="nk-nav-row"> <a href="#" class="nk-nav-logo"> <img src="assets/images/logo.png" alt="" width="100"> </a> <ul class="nk-nav-icons"> <li> <a href="#" class="no-link-effect"> <span class="ion-bag"></span> </a> </li> <li> <a href="#" class="nk-share-toggle no-link-effect"> <span class="ion-android-share-alt"></span> </a> </li> <li> <a href="#" class="nk-search-toggle no-link-effect"> <span class="nk-icon-search"></span> </a> </li> </ul> </div> <!-- START: Navigation Additional Classes: .nk-nav-row-top .nk-nav-row-center .nk-nav-row-bottom --> <div class="nk-nav-row nk-nav-row-full nk-nav-row-top"> <ul class="nk-nav" data-nav-mobile="#nk-nav-mobile"> ... </ul> </div> <!-- END: Navigation --> <div class="nk-nav-row"> <div class="nk-nav-social"> <footer> <a href="http://nkdev.info" target="_blank">nK</a> © 2016. All rights reserved </footer> </div> </div> </div> </div> </div> </nav> <!-- END: Navbar -->
Additional classes: .nk-navbar-lg .nk-navbar-align-center .nk-navbar-align-right .nk-navbar-overlay-content .nk-navbar-light
.nk-navbar-light
– light background color;.nk-navbar-lg
– large size;.nk-navbar-align-center
– text align center;.nk-navbar-align-right
– text align right;.nk-navbar-overlay-content
– show content dark overlay when opened navigation;