// // Navbar // —————————————-
.navbar {
min-height: building-units(6.5); position: relative; top: 0; border-top: 1px solid transparent; border-bottom: 1px solid transparent; @include clearfix(); @media (min-width: #{$grid-float-breakpoint}px) { padding-left: 12px; padding-right: 12px; }
}
.navbar-persistent {
@include clearfix(); @media (min-width: #{$grid-float-breakpoint}px) { float: right; } @media (max-width: #{$grid-float-breakpoint-max}px) { .active ~ & { height: 0; overflow: hidden; } }
}
.navbar-expanded {
@include clearfix(); position: relative; @media (min-width: #{$grid-float-breakpoint}px) { float: left; position: static; }
}
.container-fluid, .container-fixed {
> .navbar-persistent, > .navbar-expanded { margin-right: -12px; margin-left: -12px; }
}
.navbar-nav {
float: left; padding-top: 19px; padding-bottom: 22px; > li { float: left; margin-left: 12px; margin-right: 12px; > a { border-radius: 3px; font-size: 21px; @include button-variant($font-color-regular, #fff, transparent); padding-top: capline-bu(.75, 21px) + 1px; padding-bottom: baseline-bu(.75, 21px) - 1px; } }
}
.navbar-nav-icons {
> li > a { font-size: 26px; padding: 1px 5px 4px; > .badge { position: absolute; top: -6px; right: -10px; } } @media (min-width: #{$grid-float-breakpoint}px) { margin-right: -6px; margin-left: -6px; }
}
.navbar-header-label {
position: absolute; font-size: 21px; text-align: center; left: 48px; right: 48px; top: 25px; color: $color-brand;
}
.navbar-portalname {
float: left; font-size: 21px; font-weight: bold; text-transform: uppercase; padding-top: 24px; padding-left: 12px; padding-right: 12px; margin-right: 24px; display: none; @media (min-width: #{$grid-float-breakpoint}px) { display: block; }
}
.navbar-toggle {
position: relative; float: left; margin-left: 12px; margin-right: 12px; @media (min-width: #{$grid-float-breakpoint}px) { display: none; }
}
.navbar-default {
background-color: #fff; border-color: $color-border-bright; color: $font-color-regular; .navbar-icons > li > a { font-size: 26px; padding: 1px 5px 4px; } .form-select-js .form-select-js-choice { background-color: #fff; }
}
.navbar-btn {
float: left; margin-top: 19px; padding-left: building-units(1) - 1px; padding-right: building-units(1) - 1px; padding-top: capline-bu(.75, 21px); padding-bottom: baseline-bu(.75, 21px) - 2px; font-size: 21px; > .icon { padding: 0; }
}
.navbar-search-item {
position: inherit !important; .form-icon { font-size: 24px; } > .navbar-search { position: absolute; top: 0; left: 0; right: 0; z-index: 3; padding-left: 12px; padding-right: 12px; padding-top: 19px; }
}
.navbar-search-item-regular {
@media (min-width: #{$grid-float-breakpoint}px) { position: relative !important; > .navbar-search { left: auto; width: building-units(30); padding-top: 0; padding-left: 0; padding-right: 0; &.slide { width: 0; } &.slide.in { width: building-units(30); } &.slide .icon { transition: opacity $transition-time-out ease-out; transition-delay: 0s; opacity: 0; } &.slide.in .icon { transition-delay: $transition-time-out; opacity: 1; } } } @media (max-width: #{$grid-float-breakpoint-max}px) { > .navbar-search { background-color: #fff; &.slide { width: auto; } .cancel { font-size: 24px; } } .form-input { border: 0; &:focus { border: 0; box-shadow: none; } } }
}
.navbar-search-item-block {
.navbar-form { @include container-fixed(); margin-left: auto; margin-right: auto; } > .navbar-search { background-color: #fff; width: 100%; .cancel { font-size: 24px; } } .form-input { border: 0; &:focus { border: 0; box-shadow: none; } }
}
.navbar-left {
float: left;
}
.navbar-right {
float: right;
}