|
@@ -118,11 +118,6 @@
|
|
|
overflow: hidden;
|
|
overflow: hidden;
|
|
|
background: none;
|
|
background: none;
|
|
|
margin: $panel-margin / 2;
|
|
margin: $panel-margin / 2;
|
|
|
- transition: background-color 1s ease;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .explore-panel__loader--active {
|
|
|
|
|
- background: $text-color-faint;
|
|
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.explore-panel__loader--active:after {
|
|
.explore-panel__loader--active:after {
|
|
@@ -133,16 +128,19 @@
|
|
|
top: -50%;
|
|
top: -50%;
|
|
|
height: 250%;
|
|
height: 250%;
|
|
|
position: absolute;
|
|
position: absolute;
|
|
|
- animation: loader 2s cubic-bezier(0.17, 0.67, 0.83, 0.67);
|
|
|
|
|
|
|
+ animation: loader 2s cubic-bezier(0.17, 0.67, 0.83, 0.67) 500ms;
|
|
|
animation-iteration-count: 100;
|
|
animation-iteration-count: 100;
|
|
|
|
|
+ left: -25%;
|
|
|
background: $blue;
|
|
background: $blue;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
@keyframes loader {
|
|
@keyframes loader {
|
|
|
from {
|
|
from {
|
|
|
left: -25%;
|
|
left: -25%;
|
|
|
|
|
+ opacity: .1;
|
|
|
}
|
|
}
|
|
|
to {
|
|
to {
|
|
|
|
|
+ opacity: 1;
|
|
|
left: 100%;
|
|
left: 100%;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|