73 lines
660 B
SCSS
73 lines
660 B
SCSS
$bar: 160px;
|
|
$foo: $bar * 8;
|
|
$color: #e2e4ec;
|
|
|
|
.loader {
|
|
margin-bottom: 39px;
|
|
overflow: auto;
|
|
}
|
|
|
|
.sidenav {
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
@keyframes move {
|
|
0% {
|
|
left: 0;
|
|
}
|
|
|
|
16.7% {
|
|
left: 0;
|
|
}
|
|
|
|
33.3% {
|
|
left: calc($foo / 2);
|
|
}
|
|
|
|
50% {
|
|
left: $foo - $bar;
|
|
}
|
|
|
|
66.7% {
|
|
left: calc($foo / 2);
|
|
}
|
|
|
|
83.3% {
|
|
left: 0;
|
|
}
|
|
|
|
100% {
|
|
left: 0;
|
|
}
|
|
}
|
|
|
|
@keyframes grow {
|
|
0% {
|
|
width: $bar;
|
|
}
|
|
|
|
16.7% {
|
|
width: calc($foo / 2);
|
|
}
|
|
|
|
33.3% {
|
|
width: calc($foo / 2);
|
|
}
|
|
|
|
50% {
|
|
width: $bar;
|
|
}
|
|
|
|
66.7% {
|
|
width: calc($foo / 2);
|
|
}
|
|
|
|
83.3% {
|
|
width: calc($foo / 2);
|
|
}
|
|
|
|
100% {
|
|
width: $bar;
|
|
}
|
|
}
|