| Current Path : /home/happyrenas/old/devis-huissier.fr/old/sass/components/layout/headers/default/base/ |
Linux webd005.cluster105.gra.hosting.ovh.net 5.15.206-ovh-vps-grsec-zfs-classid #1 SMP Fri May 15 02:41:25 UTC 2026 x86_64 |
| Current File : /home/happyrenas/old/devis-huissier.fr/old/sass/components/layout/headers/default/base/_header.scss |
//* Base Header *//
// Settings
// BEGIN: Header
$header_zindex: $zindex-navbar;
$header_transition: 0.2s;
$header_height: 100px;
$header_on-scroll-height: 65px;
$topbar_height: 45px;
// Desktop mode
$header_desktop_brand-margin: 40px 0 37px 0;
$header_desktop_mega-menu-primary-link-padding: 41px 15px 39px 15px;
$header_desktop_mega-menu-btn-margin: 34px 15px 33px 15px;
$header_desktop_mega-menu-btn-icon-margin: 24px 5px 20px 5px;
$header_desktop_mega-menu-quick-sidebar-toggler-padding: 44px 0 40px 15px;
$header_desktop_mega-menu-dropdown-link-font-size: 14px;
$header_desktop_mega-menu-dropdown-link-uppercase-font-size: 12px;
$header_desktop_mega-menu-quick-search-close-icon-top: 50px;
$header_desktop_mega-menu-quick-search-close-icon-right: -2px;
$header_desktop_mega-menu-quick-search-form-control-padding: 10px 0;
$header_desktop_min-header-brand-margin: 22px 0 19px 0;
$header_desktop_min-header-mega-menu-primary-link-padding: 23px 15px 21px 15px;
$header_desktop_min-header_mega-menu-btn-margin: 15px 15px 16px 15px;
$header_desktop_min-header_mega-menu-btn-icon-margin: 6px 5px 7px 5px;
$header_desktop_min-header_mega-menu-quick-sidebar-toggler-padding: 26px 0 24px 15px;
$header_desktop_min-header-mega-menu-quick-search-close-icon-top: 33px;
$header_desktop_min-header-mega-menu-quick-search-form-control-padding: 10px 0;
// END
@import '_mixins';
// BEGIN: General mode
.c-layout-header {
@include clearfix();
// Navbar
.c-navbar {
@include clearfix();
}
// Header brand
.c-brand {
transition: all $header_transition;
@include inline-block();
> .c-hor-nav-toggler {
display: none;
}
> .c-topbar-toggler,
> .c-search-toggler,
> .c-cart-toggler {
display: none;
}
// hide when full view quick search is shown
.c-layout-quick-search-shown & {
display: none;
}
// logo
.c-desktop-logo {
display: block;
}
.c-desktop-logo-inverse {
display: none;
}
> .c-btn-login {
display: none;
}
}
// Quick search
.c-quick-search {
display: none;
padding: 0;
margin: 0;
transition: all $header_transition;
position: relative;
@include clearfix();
// search shown state
.c-layout-quick-search-shown & {
display: block;
transition: all $header_transition;
}
> .form-control {
display: block;
font-size: 22px;
font-weight: 400;
border: 0;
background: transparent;
box-shadow: none;
@include border-radius(0);
// remove IE10+ clear icon
&::-ms-clear {
display: none;
}
&:focus,
&:active {
box-shadow: none;
}
}
> span {
display: inline-block;
position: absolute;
font-size: 36px;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
&:hover {
cursor: pointer;
}
}
}
}
// END
// BEGIN: Desktop mode
@media (min-width: $screen-md-min) { /* 992px */
// Base header
.c-layout-header {
&.c-no-border {
border-bottom: 0 !important;
}
// Navbar
.c-navbar {
line-height: 0px;
// reset container position for mega menu support
> .container {
position: relative;
}
> .container-fluid {
position: relative;
padding: $layout-fluid-padding;
}
}
// Header brand
.c-brand {
margin: $header_desktop_brand-margin;
.c-desktop-logo-inverse {
display: none;
}
.c-desktop-logo {
display: inline-block;
}
.c-mobile-logo {
display: none;
}
}
// Quick search
.c-quick-search {
> .form-control {
padding: $header_desktop_mega-menu-quick-search-form-control-padding;
height: $header_height;
}
> span {
top: $header_desktop_mega-menu-quick-search-close-icon-top;
right: $header_desktop_mega-menu-quick-search-close-icon-right;
}
}
}
// Fixed header
.c-layout-header-fullscreen.c-layout-header-static .c-layout-header,
.c-layout-header-fixed .c-layout-header {
top: 0;
position: fixed;
z-index: $header_zindex;
width: 100%;
}
.c-layout-header-fixed .c-layout-page {
margin-top: $header_height;
}
.c-layout-header-fixed.c-layout-header-topbar .c-layout-page {
margin-top: $header_height + $topbar_height;
}
.c-layout-header-fullscreen .c-layout-page,
.c-layout-header-fullscreen.c-layout-header-fixed.c-layout-header-topbar .c-layout-page {
margin-top: 0;
}
// Minimized mode on scroll
.c-page-on-scroll.c-layout-header-static .c-layout-header {
display: none;
}
.c-page-on-scroll.c-layout-header-fixed .c-layout-header {
height: $header_on-scroll-height;
line-height: 0px;
// Brand
.c-brand {
transition: margin $header_transition;
margin: $header_desktop_min-header-brand-margin;
// logo
.c-desktop-logo {
display: none;
}
.c-desktop-logo-inverse {
display: block;
}
}
// Horizontal Navigation bar
.c-mega-menu {
line-height: 0px;
.nav.navbar-nav > li {
// link
> .c-link {
transition: all $header_transition;
padding: $header_desktop_min-header-mega-menu-primary-link-padding;
min-height: $header_on-scroll-height;
}
// Quick sidebar toggler
> .c-quick-sidebar-toggler {
transition: all $header_transition;
padding: $header_desktop_min-header_mega-menu-quick-sidebar-toggler-padding;
}
// button
> .c-btn {
transition: all $header_transition;
margin: $header_desktop_min-header_mega-menu-btn-margin;
}
// icon
> .c-btn-icon {
transition: all $header_transition;
margin: $header_desktop_min-header_mega-menu-btn-icon-margin;
}
}
}
// Quick search form
.c-quick-search {
> .form-control {
font-size: 22px;
padding: $header_desktop_min-header-mega-menu-quick-search-form-control-padding;
height: $header_on-scroll-height;
}
// close icon
> span {
font-size: 36px;
top: $header_desktop_min-header-mega-menu-quick-search-close-icon-top;
}
}
}
}
// END