Header Search Forms
Various search form controls and components within a navbar.
Default search
<!-- Search -->
<div class="position-relative">
<a class="btn btn-xs btn-icon btn-text-dark u-header__search-toggle" href="javascript:;" role="button"
aria-haspopup="true"
aria-expanded="false"
aria-controls="search"
data-unfold-target="#search"
data-unfold-hide-on-scroll="false"
data-unfold-type="css-animation"
data-unfold-duration="300"
data-unfold-delay="300"
data-unfold-animation-in="slideInUp">
<span class="fa fa-search btn-icon__inner"></span>
</a>
<!-- Input -->
<form id="search" class="js-focus-state input-group form u-unfold u-header__search u-unfold--css-animation u-unfold--hidden">
<input class="form-control form__input" type="search" placeholder="Search Space">
<div class="input-group-addon u-header__search-addon p-0">
<button class="btn btn-primary u-header__search-addon-btn" type="button">
<span class="fa fa-search"></span>
</button>
</div>
</form>
<!-- End Input -->
</div>
<!-- End Search -->