Current path: home/webdevt/www/wdp/wp-content/themes/quadric/assets/css/scss/modules/header/
?? Go up: /home/webdevt/www/wdp/wp-content/themes/quadric/assets/css/scss/modules
@import "blocks/logo";
@import "blocks/main_menu";
@import "widgets/search";
@import "widgets/sections";
@import "widgets/banner";
@import "top-bar/top-bar";
@import "types/header-standard/_header-standard";
@import "types/mobile-header/_mobile-header";
$logo-area-height: 220px;
$menu-area-height: 60px;
$sticky-header-height: 60px;
/* ==========================================================================
#Headers style - start
========================================================================== */
.edgtf-page-header {
display: inline-block;
margin: 0;
position: relative;
vertical-align: middle;
width: 100%;
z-index: 110;
/* ==========================================================================
#General header layout - start
========================================================================== */
a img {
display: block;
}
.edgtf-grid{
height: 100%;
.edgtf-vertical-align-containers{
padding: 0;
@include edgtfTransition(background-color 0.3s ease);
}
}
/* ==========================================================================
#General header layout - end
========================================================================== */
/* ==========================================================================
#Logo area styles - start
========================================================================== */
.edgtf-logo-area {
height: $logo-area-height;
overflow: hidden;
position: relative;
.edgtf-logo-wrapper a {
max-height: $logo-area-height*0.9;
}
}
/* ==========================================================================
#Logo area styles - end
========================================================================== */
/* ==========================================================================
#Menu area styles - start
========================================================================== */
.edgtf-menu-area {
height: $menu-area-height;
position: relative;
@include edgtfTransition(background-color 0.3s ease);
.edgtf-logo-wrapper a {
max-height: $menu-area-height*0.9;
}
}
/* ==========================================================================
#Menu area styles - end
========================================================================== */
/* ==========================================================================
#Sticky header styles - start
========================================================================== */
.edgtf-sticky-header{
height: $sticky-header-height;
width: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 100;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
-webkit-transition: -webkit-transform 0.33s ease;
transition: transform 0.3s ease;
box-sizing: border-box;
border-bottom: 1px solid $default-border-color;
-webkit-backface-visibility: hidden;
&.header-appear{
transform: translateY(0%);
}
.edgtf-sticky-holder {
height: 100%;
background-color: #fff;
position: relative;
z-index: 2;
}
.admin-bar &.header-appear{
top: 32px;
}
.edgtf-position-left-inner {
height: auto;
}
.edgtf-position-center-inner {
height: 100%;
}
.edgtf-sticky-holder .edgtf-logo-wrapper a {
max-height: $sticky-header-height*0.9;
}
.edgtf-sticky-right{
display: inline-block;
vertical-align: middle;
}
}
.admin-bar .edgtf-page-header .edgtf-sticky-header.header-appear {
transform: translateY(32px);
}
/* ==========================================================================
#Sticky header styles - start
========================================================================== */
/* ==========================================================================
#Fixed header styles - start
========================================================================== */
.edgtf-fixed-wrapper.fixed{
width: 100%;
position: fixed;
left: 0px;
top: 0px;
-webkit-backface-visibility: hidden;
}
/* ==========================================================================
#Fixed header - end
========================================================================== */
}
.admin-bar .edgtf-page-header .edgtf-fixed-wrapper.fixed {
top: 32px;
}
/* ==========================================================================
#Light header - begin
========================================================================== */
.edgtf-light-header{
.edgtf-logo-area,
.edgtf-menu-area,
.edgtf-vertical-menu-area{
color: $header-light-color !important; //Beacause of inline color styles
.widget {
color: $header-light-color !important; //Beacause of inline color styles
p,
a,
span,
i,
.widgettitle {
color: $header-light-color !important; //Beacause of inline color styles
}
}
.edgtf-light-logo{
opacity: 1;
}
.edgtf-dark-logo,
.edgtf-normal-logo{
opacity: 0;
}
}
}
/* ==========================================================================
#Light header - end
========================================================================== */
/* ==========================================================================
#Dark header - begin
========================================================================== */
.edgtf-dark-header{
.edgtf-logo-area,
.edgtf-menu-area,
.edgtf-vertical-menu-area{
color: $header-dark-color !important; //Because of inline color styles
.widget {
color: $header-dark-color !important; //Beacause of inline color styles
p,
a,
span,
i,
.widgettitle {
color: $header-dark-color !important; //Beacause of inline color styles
}
}
.edgtf-dark-logo{
opacity: 1;
}
.edgtf-normal-logo,
.edgtf-light-logo{
opacity: 0;
}
}
}
/* ==========================================================================
#Dark header - end
========================================================================== */
/* ==========================================================================
#Headers style - end
========================================================================== */