59 lines
1.2 KiB
SCSS
59 lines
1.2 KiB
SCSS
|
#preloader {
|
||
|
|
position: fixed;
|
||
|
|
width: 100%;
|
||
|
|
height: 100vh;
|
||
|
|
display: grid;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
background: $light-white;
|
||
|
|
z-index: 10000;
|
||
|
|
|
||
|
|
.loader {
|
||
|
|
position: fixed;
|
||
|
|
top: 50%;
|
||
|
|
left: 50%;
|
||
|
|
transform: translate(-50%, -50%);
|
||
|
|
svg {
|
||
|
|
height: 300px;
|
||
|
|
display: block;
|
||
|
|
margin: 0 auto;
|
||
|
|
path {
|
||
|
|
animation-duration: 1s;
|
||
|
|
animation-name: pulse;
|
||
|
|
animation-iteration-count: infinite;
|
||
|
|
color: $accent-1;
|
||
|
|
|
||
|
|
&.path-7 {
|
||
|
|
animation-delay: -1s
|
||
|
|
}
|
||
|
|
&.path-6 {
|
||
|
|
animation-delay: -.875s
|
||
|
|
}
|
||
|
|
&.path-5 {
|
||
|
|
animation-delay: -.75s
|
||
|
|
}
|
||
|
|
&.path-4 {
|
||
|
|
animation-delay: -.625s
|
||
|
|
}
|
||
|
|
&.path-3 {
|
||
|
|
animation-delay: -.5s
|
||
|
|
}
|
||
|
|
&.path-2 {
|
||
|
|
animation-delay: -.375s
|
||
|
|
}
|
||
|
|
&.path-1 {
|
||
|
|
animation-delay: -.25s
|
||
|
|
}
|
||
|
|
&.path-0 {
|
||
|
|
animation-delay: -.125s
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes pulse {
|
||
|
|
0% { opacity: .1; }
|
||
|
|
30% { opacity: .8; }
|
||
|
|
100% { opacity: .1; }
|
||
|
|
}
|
||
|
|
}
|