广丰卷烟厂数采质量分析系统
zhuguifei
7 天以前 2b31fa203f3435a582be51f45899d99164c9917a
ruoyi-plus-soybean/src/styles/scss/loading.scss
@@ -17,9 +17,10 @@
  }
}
.loader:before, .loader:after {
.loader:before,
.loader:after {
  --r: 20.5deg;
  content: "";
  content: '';
  width: 320px;
  height: 140px;
  position: absolute;
@@ -57,19 +58,26 @@
  width: 200px;
  height: 200px;
  background: var(--primary);
  background: linear-gradient(45deg, var(--primary) 0%, var(--primary) 50%, var(--primary-light) 50%, var(--primary-light) 100%);
  background: linear-gradient(
    45deg,
    var(--primary) 0%,
    var(--primary) 50%,
    var(--primary-light) 50%,
    var(--primary-light) 100%
  );
  transform-style: preserve-3d;
  -webkit-animation: ground var(--duration) linear forwards infinite;
  animation: ground var(--duration) linear forwards infinite;
}
.loader .ground div:before, .loader .ground div:after {
.loader .ground div:before,
.loader .ground div:after {
  --rx: 90deg;
  --ry: 0deg;
  --x: 44px;
  --y: 162px;
  --z: -50px;
  content: "";
  content: '';
  width: 156px;
  height: 300px;
  opacity: 0;
@@ -108,13 +116,14 @@
  transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
}
.loader .box div:before, .loader .box div:after {
.loader .box div:before,
.loader .box div:after {
  --rx: 90deg;
  --ry: 0deg;
  --z: 24px;
  --y: -24px;
  --x: 0;
  content: "";
  content: '';
  position: absolute;
  background-color: inherit;
  width: inherit;
@@ -272,7 +281,8 @@
    transform: translate(var(--x), var(--y));
  }
  25%, 52% {
  25%,
  52% {
    transform: translate(0, 0);
  }
@@ -280,7 +290,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -290,7 +301,8 @@
    transform: translate(var(--x), var(--y));
  }
  25%, 52% {
  25%,
  52% {
    transform: translate(0, 0);
  }
@@ -298,7 +310,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -308,7 +321,8 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  14%, 100% {
  14%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@@ -318,7 +332,8 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  14%, 100% {
  14%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@@ -328,7 +343,8 @@
    transform: translate(var(--x), var(--y));
  }
  29%, 52% {
  29%,
  52% {
    transform: translate(0, 0);
  }
@@ -336,7 +352,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -346,7 +363,8 @@
    transform: translate(var(--x), var(--y));
  }
  29%, 52% {
  29%,
  52% {
    transform: translate(0, 0);
  }
@@ -354,7 +372,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -364,7 +383,8 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  18%, 100% {
  18%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@@ -374,7 +394,8 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  18%, 100% {
  18%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@@ -384,7 +405,8 @@
    transform: translate(var(--x), var(--y));
  }
  33%, 52% {
  33%,
  52% {
    transform: translate(0, 0);
  }
@@ -392,7 +414,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -402,7 +425,8 @@
    transform: translate(var(--x), var(--y));
  }
  33%, 52% {
  33%,
  52% {
    transform: translate(0, 0);
  }
@@ -410,7 +434,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -420,7 +445,8 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  22%, 100% {
  22%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@@ -430,7 +456,8 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  22%, 100% {
  22%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@@ -440,7 +467,8 @@
    transform: translate(var(--x), var(--y));
  }
  37%, 52% {
  37%,
  52% {
    transform: translate(0, 0);
  }
@@ -448,7 +476,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -458,7 +487,8 @@
    transform: translate(var(--x), var(--y));
  }
  37%, 52% {
  37%,
  52% {
    transform: translate(0, 0);
  }
@@ -466,7 +496,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -476,7 +507,8 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  26%, 100% {
  26%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@@ -486,7 +518,8 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  26%, 100% {
  26%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@@ -496,7 +529,8 @@
    transform: translate(var(--x), var(--y));
  }
  41%, 52% {
  41%,
  52% {
    transform: translate(0, 0);
  }
@@ -504,7 +538,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -514,7 +549,8 @@
    transform: translate(var(--x), var(--y));
  }
  41%, 52% {
  41%,
  52% {
    transform: translate(0, 0);
  }
@@ -522,7 +558,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -532,7 +569,8 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  30%, 100% {
  30%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@@ -542,7 +580,8 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  30%, 100% {
  30%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@@ -552,7 +591,8 @@
    transform: translate(var(--x), var(--y));
  }
  45%, 52% {
  45%,
  52% {
    transform: translate(0, 0);
  }
@@ -560,7 +600,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -570,7 +611,8 @@
    transform: translate(var(--x), var(--y));
  }
  45%, 52% {
  45%,
  52% {
    transform: translate(0, 0);
  }
@@ -578,7 +620,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -588,7 +631,8 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  34%, 100% {
  34%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@@ -598,7 +642,8 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  34%, 100% {
  34%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@@ -608,7 +653,8 @@
    transform: translate(var(--x), var(--y));
  }
  49%, 52% {
  49%,
  52% {
    transform: translate(0, 0);
  }
@@ -616,7 +662,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -626,7 +673,8 @@
    transform: translate(var(--x), var(--y));
  }
  49%, 52% {
  49%,
  52% {
    transform: translate(0, 0);
  }
@@ -634,7 +682,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -644,7 +693,8 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  38%, 100% {
  38%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@@ -654,7 +704,8 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  38%, 100% {
  38%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@@ -664,7 +715,8 @@
    transform: translate(var(--x), var(--y));
  }
  53%, 52% {
  53%,
  52% {
    transform: translate(0, 0);
  }
@@ -672,7 +724,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -682,7 +735,8 @@
    transform: translate(var(--x), var(--y));
  }
  53%, 52% {
  53%,
  52% {
    transform: translate(0, 0);
  }
@@ -690,7 +744,8 @@
    transform: translate(0, -32px);
  }
  90%, 100% {
  90%,
  100% {
    transform: translate(0, 188px);
  }
}
@@ -700,7 +755,8 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  42%, 100% {
  42%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@@ -710,17 +766,20 @@
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
  }
  42%, 100% {
  42%,
  100% {
    transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1);
  }
}
@-webkit-keyframes ground {
  0%, 65% {
  0%,
  65% {
    transform: rotateX(90deg) rotateY(0deg) translate(-48px, -120px) translateZ(100px) scale(0);
  }
  75%, 90% {
  75%,
  90% {
    transform: rotateX(90deg) rotateY(0deg) translate(-48px, -120px) translateZ(100px) scale(1);
  }
@@ -730,11 +789,13 @@
}
@keyframes ground {
  0%, 65% {
  0%,
  65% {
    transform: rotateX(90deg) rotateY(0deg) translate(-48px, -120px) translateZ(100px) scale(0);
  }
  75%, 90% {
  75%,
  90% {
    transform: rotateX(90deg) rotateY(0deg) translate(-48px, -120px) translateZ(100px) scale(1);
  }
@@ -744,11 +805,13 @@
}
@-webkit-keyframes ground-shine {
  0%, 70% {
  0%,
  70% {
    opacity: 0;
  }
  75%, 87% {
  75%,
  87% {
    opacity: 0.2;
  }
@@ -758,11 +821,13 @@
}
@keyframes ground-shine {
  0%, 70% {
  0%,
  70% {
    opacity: 0;
  }
  75%, 87% {
  75%,
  87% {
    opacity: 0.2;
  }
@@ -772,21 +837,25 @@
}
@-webkit-keyframes mask {
  0%, 65% {
  0%,
  65% {
    opacity: 0;
  }
  66%, 100% {
  66%,
  100% {
    opacity: 1;
  }
}
@keyframes mask {
  0%, 65% {
  0%,
  65% {
    opacity: 0;
  }
  66%, 100% {
  66%,
  100% {
    opacity: 1;
  }
}