File: /var/www/vhosts/creativefellows.nl/recht.creativefellows.nl/public/scss/_header.scss
header{
z-index:1000;
.top-bar{
//margin-top:1rem;
background:$white;
width:100%;
padding:0.5rem;
z-index:1000;
position:relative;
flex-wrap: wrap;
@include animate();
/*
* left
*/
.top-bar-left{
padding:0.5rem;
.logo{
display:block;
float:left;
height:3rem;
position:relative;
//transform:translateY(-1.5rem);
svg{
position:relative;
display:block;
height:100%;display:block;
@include animate();
}
}
}
/*
* right
*/
.top-bar-right{
padding-right:0.5rem;
ul{
background:none;
.link{
color:$dark-gray;
position:relative;
//@include breakpoint(large up){
// + ul{display:none;visibility:hidden;}
// &.current{font-weight:400;}
// &.current::after{content:"";bottom:calc(-1.25rem + 3px);left:1rem;right:1rem;border-bottom:solid 2px $primary-color;z-index:1;}
//}
}
.link__active::after{content:"";bottom:0.25rem;left:1rem;right:1rem;border-bottom:solid 2px $primary-color;z-index:1;position:absolute;}
/*@include breakpoint(medium down){
padding-right:0;
li{
border-bottom:solid 1px rgba($light-gray,0.5);
text-align:center;
&:last-child{border:none;}
}
li a{
font-size:1.125rem;padding:1rem;
&.is-active{font-weight:400;}
}
li ul{
margin:0 0 1.5rem 0;
background:$white;
a{font-size:0.875rem;}
}
li ul li:last-child{border:none;};
&::after{
top:auto;
bottom:-0.5rem;
border:none;
width:100%;
background-position:50% 50%;
background-size: auto 1.5rem;
height:3rem;
}
}
*/
}
}
@include breakpoint(medium down){
margin-top:0;
padding-top:1.5rem;
padding-bottom:0;
}
}
&.is-stuck{
.top-bar{
box-shadow:0 1rem 1rem rgba($black,0.125);
}
.top-bar-left .logo{
}
}
}