p5.js-web-editor/client/styles/components/_loader.scss

48 lines
651 B
SCSS
Raw Permalink Normal View History

.loader-container {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.loader {
width: #{80 / $base-font-size }rem;
height: #{80 / $base-font-size}rem;
position: relative;
}
.loader__circle1,
.loader__circle2 {
width: 100%;
height: 100%;
border-radius: 80%;
@include themify() {
background-color: getThemifyVariable('logo-color');
}
opacity: 0.6;
position: absolute;
top: 0;
left: 0;
animation: sk-bounce 2.0s infinite ease-in-out;
}
.loader__circle2 {
animation-delay: -1.0s;
}
@keyframes sk-bounce {
0%,
100% {
transform: scale(0.0);
}
50% {
transform: scale(1.0);
}
}