Authored by 郭成尧

loading

  1 +@keyframes loading {
  2 + 0% {
  3 + transform: rotate(0deg);
  4 + }
  5 +
  6 + 25% {
  7 + transform: rotate(90deg);
  8 + }
  9 +
  10 + 50% {
  11 + transform: rotate(180deg);
  12 + }
  13 +
  14 + 75% {
  15 + transform: rotate(270deg);
  16 + }
  17 +
  18 + 100% {
  19 + transform: rotate(360deg);
  20 + }
  21 +}
  22 +
1 .grade-detail-page { 23 .grade-detail-page {
2 .grade-graph { 24 .grade-graph {
3 width: 100%; 25 width: 100%;
@@ -7,13 +29,14 @@ @@ -7,13 +29,14 @@
7 } 29 }
8 30
9 .loading-mask { 31 .loading-mask {
  32 + margin-top: 104px;
10 width: 100%; 33 width: 100%;
11 - height: 500px; 34 + height: 502px;
12 position: fixed; 35 position: fixed;
13 top: 0; 36 top: 0;
14 left: 0; 37 left: 0;
15 z-index: 2; 38 z-index: 2;
16 - background-color: #2b2b2b; 39 + background-color: #444;
17 display: flex; 40 display: flex;
18 flex-direction: column; 41 flex-direction: column;
19 justify-content: center; 42 justify-content: center;
@@ -22,8 +45,10 @@ @@ -22,8 +45,10 @@
22 .loading-logo { 45 .loading-logo {
23 width: 80px; 46 width: 80px;
24 height: 80px; 47 height: 80px;
25 - background: resolve("activity/grade/loading.gif"); 48 + background: resolve("activity/grade/loading2.png");
26 background-size: 100%; 49 background-size: 100%;
  50 + animation: loading 1.5s infinite;
  51 + animation-timing-function: linear;
27 } 52 }
28 53
29 .loading-text { 54 .loading-text {