56 lines
1.0 KiB
SCSS
56 lines
1.0 KiB
SCSS
|
.loading-overlay {
|
||
|
|
&.is-full-page {
|
||
|
|
.loading-background {
|
||
|
|
background:rgba(0,0,0,0.85);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.loading-container {
|
||
|
|
position: relative;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
|
||
|
|
.loading-tornado {
|
||
|
|
&:after {
|
||
|
|
content: '';
|
||
|
|
display: block;
|
||
|
|
height: 60px;
|
||
|
|
width: 60px;
|
||
|
|
background-image: url('../img/logo.svg');
|
||
|
|
animation: spinAroundReverse 2000ms infinite linear;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.loading-message {
|
||
|
|
padding-top: .5rem;
|
||
|
|
color: $primary;
|
||
|
|
text-align: center;
|
||
|
|
|
||
|
|
+ .button {
|
||
|
|
margin-top: .5rem;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.loading-alert {
|
||
|
|
padding-top: 1.5rem;
|
||
|
|
color: $primary;
|
||
|
|
font-size: 0.8rem;
|
||
|
|
text-align: center;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
.button {
|
||
|
|
margin-top: 1rem;
|
||
|
|
font-size: 0.8rem;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes spinAroundReverse {
|
||
|
|
from {
|
||
|
|
transform: rotate(359deg); }
|
||
|
|
to {
|
||
|
|
transform: rotate(0deg); }
|
||
|
|
}
|