You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
76 lines
1.1 KiB
76 lines
1.1 KiB
.spinner-wrapper {
|
|
transition: background-color 1200ms ease-out;
|
|
|
|
&.is-block {
|
|
width: auto;
|
|
position: absolute;
|
|
z-index: 99999;
|
|
left: 50%;
|
|
top: 50%;
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
|
|
&.is-fixed {
|
|
background-color: rgba(#fff, 1.0);
|
|
z-index: 99999;
|
|
position: fixed;
|
|
width: 100%;
|
|
height: 100%;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
}
|
|
|
|
&.reverse,
|
|
&.dismissed {
|
|
background-color: rgba(#fff, 0.0);
|
|
}
|
|
|
|
&.dismissed {
|
|
position: fixed;
|
|
width: 0;
|
|
height: 0;
|
|
left: -10000px;
|
|
top: -10000px;
|
|
right: auto;
|
|
bottom: auto;
|
|
overflow: hidden;
|
|
}
|
|
}
|
|
|
|
.spinner-wrapper,
|
|
.spinner {
|
|
display: inline-flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 100%;
|
|
}
|
|
|
|
.spinner {
|
|
padding: 10rpx;
|
|
opacity: 1;
|
|
transition: opacity 1200ms ease-out;
|
|
|
|
&.reverse,
|
|
&.dismissed {
|
|
opacity: 0;
|
|
}
|
|
}
|
|
|
|
.spinner-icon {
|
|
width: 38px;
|
|
height: 38px;
|
|
animation: spinner-rotation 600ms linear infinite;
|
|
}
|
|
|
|
@keyframes spinner-rotation {
|
|
from {
|
|
transform: rotate(0);
|
|
}
|
|
|
|
to {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
|