liebling/src/sass/components/search/_search.scss
2019-05-21 21:50:29 +02:00

52 lines
916 B
SCSS

.m-search {
visibility: hidden;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
overflow-y: auto;
z-index: 2;
background-color: rgba(255,255,255,0.99);
-webkit-overflow-scrolling: touch;
@include transform(scale(1.2));
@include transition(all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1));
&.opened {
visibility: visible;
opacity: 1;
z-index: 10;
@include transform(scale(1));
}
}
.m-search__content {
padding: 80px $mobile-space 40px;
margin: 0 auto;
@include respond-to('medium') {
padding-top: 100px;
padding-bottom: 50px;
max-width: 700px;
}
@include respond-to('extra-large') {
padding-left: 0;
padding-right: 0;
}
@include respond-to('largest') {
max-width: 800px;
}
}
.m-search__form {
margin-bottom: 30px;
@include respond-to('medium') {
max-width: 500px;
margin: 0 auto 45px;
}
}