@lxlib/theme
Version:
This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.1.1.
88 lines (80 loc) • 1.48 kB
text/less
/**
* 未被直接引用,为了尽可快渲染预加载状态,生成的CSS代码已直接在 `index.html` 中引用
*/
.preloader {
position: fixed;
top: 0;
left: 0;
z-index: 9999;
width: 100%;
height: 100%;
overflow: hidden;
background: #49a9ee;
transition: opacity 0.65s;
}
.preloader-hidden-add {
display: block;
opacity: 1;
}
.preloader-hidden-add-active {
opacity: 0;
}
.preloader-hidden {
display: none;
}
.cs-loader {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.cs-loader-inner {
position: absolute;
top: 50%;
width: 100%;
color: #fff;
text-align: center;
transform: translateY(-50%);
label {
display: inline-block;
font-size: 20px;
opacity: 0;
&:nth-child(6) {
animation: lol 3s infinite ease-in-out;
}
&:nth-child(5) {
animation: lol 3s 100ms infinite ease-in-out;
}
&:nth-child(4) {
animation: lol 3s 200ms infinite ease-in-out;
}
&:nth-child(3) {
animation: lol 3s 300ms infinite ease-in-out;
}
&:nth-child(2) {
animation: lol 3s 400ms infinite ease-in-out;
}
&:nth-child(1) {
animation: lol 3s 500ms infinite ease-in-out;
}
}
}
@keyframes lol {
0% {
transform: translateX(-300px);
opacity: 0;
}
33% {
transform: translateX(0);
opacity: 1;
}
66% {
transform: translateX(0);
opacity: 1;
}
100% {
transform: translateX(300px);
opacity: 0;
}
}