Sha256: 8644c1d16fc63eca06c68d0b3d1765a2feca2a6162f36cfae6e0dd2852e87a9e
Contents?: true
Size: 1.3 KB
Versions: 27
Compression:
Stored size: 1.3 KB
Contents
$nav-mobile-color : $c-navy !default;
$button-menu-slice-height: 3px !default;
.nav-mobile {
position: absolute;
top: 3px;
right: $gutter-width/4;
z-index: 15;
width: 42px;
height: 42px;
@include respond-to($sidebar-breakpoint, true) {
top: $header-height;
right: $gutter-width;
}
&__hamburger {
position: absolute;
top: 19px;
left: 50%;
display: block;
width: 20px;
height: $button-menu-slice-height;
padding: 0;
margin-left: -10px;
color: transparent;
text-indent: -999em;
background-color: $nav-mobile-color;
border: 0;
border-radius: 2px;
transition: all .2s;
&:before,
&:after {
position: absolute;
left: 0;
width: 100%;
height: $button-menu-slice-height;
background-color: $nav-mobile-color;
border-radius: 2px;
content: "";
transition: all .2s;
}
&:before {
top: -6px;
transform-origin: 33% 100%;
}
&:after {
top: 6px;
transform-origin: 33% 0;
}
}
}
.nav-mobile--active .nav-mobile__hamburger {
background: transparent;
&:before,
&:after {
top: 0;
}
&:before {
transform: translateY(-3px) translateX(1px) rotate(45deg);
}
&:after {
transform: translateY(3px) translateX(1px) rotate(-45deg);
}
}
Version data entries
27 entries across 27 versions & 2 rubygems