There are two available types of topbar:
- .ct-topBar
- .ct-topBar–darkStyle
To use any of them, first use the following HTML markup:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 |
<div class="ct-topBar ct-topBar--darkStyle"> <div class="container"> <div class="row"> <div class="col-sm-7 col-md-7"> <div class="ct-panel--contact ct-panel--left"> <div class="ct-panel--item ct-email"> <a href="#"><i class="fa fa-envelope-o"></i> example@example.com</a> </div> <ul class="nav navbar-nav ct-switcher--language"> <li class="dropdown"> <a href="#"> <i class="fa fa-globe"></i> English <i class="fa fa-angle-down"></i> </a> <ul class="dropdown-menu"> <li> <a href="#"> English </a> </li> <li> <a href="#"> Spanish </a> </li> <li> <a href="#"> German </a> </li> </ul> </li> </ul> <div id="ct-js-navSearch"> <i class="fa fa-search"></i> <input placeholder="Search ..." required type="text" name="field[]" class="form-control input-lg ct-input--search"> </div> <div class="ct-navbar-search"> <form role="form"> <button class="ct-navbar-search-button" type="submit"> <i class="fa fa-search fa-fw"></i> </button> <div class="form-group"> <input id="search" placeholder="Search ..." required type="text" class="form-control input-lg"> </div> </form> </div> </div> </div> <div class="col-sm-5 col-md-5"> <div class="ct-panel--right text-right"> <div class="ct-panel--item"> <h6 class="ct-fw-600">Welcome to Estato Agency, we are at your disposal</h6> </div> </div> </div> </div> </div> </div> |