Navigation Bar

Simple Navigation Bar

<header>
    <nav class="nav bg-dark bx-sh-primary-3">
        <div class="nav-header-section">
            <div class="nav-title">
                XenDesign
            </div>
            <div class="input-box input input-dark">
                <i class="fa fa-search"></i>
                <input type="text" placeholder="Search something..." class="input">
            </div>
        </div>
        <div class="nav actions">
            <a href="">Home</a>
            <a href="" class="btn">
                <div class="badge-holder">
                    <i class="fa fa-shopping-cart btn btn-round-md bg-light text-dark"></i>
                    <span class="badge badge-info">10</span>
                </div>
            </a>
        </div>
    </nav>
</header>

Fixed Navigation Bar

<header class="relative">
    <nav class="nav nav-fixed bg-dark bx-sh-primary-3">
        <div class="nav-header-section">
            <div class="nav-title">
                XenDesign
            </div>
            <div class="nav-logo">
         <img src="https://iconscout.com/iconscout_logo-1024x1024.png" alt="logo">
            </div>
            <div class="input-box input input-dark">
                <i class="fa fa-search"></i>
                <input type="text" placeholder="Search something..." class="input">
            </div>
        </div>
        <div class="nav actions">
            <a href="">Home</a>
            <a href="" class="btn">
                <div class="badge-holder">
                    <i class="fa fa-shopping-cart btn btn-round-md bg-light text-dark"></i>
                    <span class="badge badge-info">10</span>
                </div>
            </a>
        </div>
    </nav>
</header>