_animation.scss 2.09 KB
Newer Older
1 2 3
// Animations
@keyframes esri-fade-in-down {
  0% {
杨思琦's avatar
杨思琦 committed
4
    transform: translate3d(0, -5px, 0);
5 6
    opacity: 0;
  }
杨思琦's avatar
杨思琦 committed
7

8
  25% {
杨思琦's avatar
杨思琦 committed
9
    transform: translate3d(0, -5px, 0);
10 11
    opacity: 0;
  }
杨思琦's avatar
杨思琦 committed
12

13
  100% {
杨思琦's avatar
杨思琦 committed
14
    transform: translate3d(0, 0, 0);
15 16 17 18 19 20
    opacity: 1;
  }
}

@keyframes esri-fade-in-up {
  0% {
杨思琦's avatar
杨思琦 committed
21
    transform: translate3d(0, 5px, 0);
22 23
    opacity: 0;
  }
杨思琦's avatar
杨思琦 committed
24

25
  25% {
杨思琦's avatar
杨思琦 committed
26
    transform: translate3d(0, 5px, 0);
27 28
    opacity: 0;
  }
杨思琦's avatar
杨思琦 committed
29

30
  100% {
杨思琦's avatar
杨思琦 committed
31
    transform: translate3d(0, 0, 0);
32 33 34 35 36 37 38 39
    opacity: 1;
  }
}

@keyframes esri-fade-in {
  0% {
    opacity: 0;
  }
杨思琦's avatar
杨思琦 committed
40

41 42 43
  25% {
    opacity: 0;
  }
杨思琦's avatar
杨思琦 committed
44

45 46 47 48 49 50 51
  100% {
    opacity: 1;
  }
}

@keyframes esri-fade-in-scale {
  0% {
杨思琦's avatar
杨思琦 committed
52
    transform: scale3d(0.95, 0.95, 1);
53 54
    opacity: 0;
  }
杨思琦's avatar
杨思琦 committed
55

56
  100% {
杨思琦's avatar
杨思琦 committed
57
    transform: scale3d(1, 1, 1);
58 59 60 61 62 63
    opacity: 1;
  }
}

@keyframes looping-progresss-bar-ani {
  0% {
杨思琦's avatar
杨思琦 committed
64 65
    left: 0;
    width: 0;
66 67
  }
  #{$looping-progress-bar-width} {
杨思琦's avatar
杨思琦 committed
68
    left: 0;
69 70
    width: $looping-progress-bar-width;
  }
杨思琦's avatar
杨思琦 committed
71
  #{100 - $looping-progress-bar-width} {
72 73 74
    left: 100% - $looping-progress-bar-width;
    width: $looping-progress-bar-width;
  }
杨思琦's avatar
杨思琦 committed
75

76 77
  100% {
    left: 100%;
杨思琦's avatar
杨思琦 committed
78
    width: 0;
79 80 81 82 83 84 85
  }
}

@keyframes esri-rotate {
  0% {
    transform: rotate(0);
  }
杨思琦's avatar
杨思琦 committed
86

87 88 89 90 91 92 93 94
  100% {
    transform: rotate(360deg);
  }
}

@keyframes panel-advance {
  0% {
    transform: translate3d(50px, 0, 0) scale(0.99);
杨思琦's avatar
杨思琦 committed
95
    opacity: 0;
96
  }
杨思琦's avatar
杨思琦 committed
97

98 99
  100% {
    transform: translate3d(0, 0, 0) scale(1);
杨思琦's avatar
杨思琦 committed
100
    opacity: 1;
101 102 103 104 105 106
  }
}

@keyframes panel-retreat {
  0% {
    transform: translate3d(-50px, 0, 0) scale(0.99);
杨思琦's avatar
杨思琦 committed
107
    opacity: 0;
108
  }
杨思琦's avatar
杨思琦 committed
109

110 111
  100% {
    transform: translate3d(0, 0, 0) scale(1);
杨思琦's avatar
杨思琦 committed
112
    opacity: 1;
113 114 115 116 117 118 119 120 121
  }
}

/* ==========================================================================
   RTL
   ========================================================================== */
@keyframes panel-advance--rtl {
  0% {
    transform: translate3d(-50px, 0, 0) scale(0.99);
杨思琦's avatar
杨思琦 committed
122
    opacity: 0;
123
  }
杨思琦's avatar
杨思琦 committed
124

125 126
  100% {
    transform: translate3d(0, 0, 0) scale(1);
杨思琦's avatar
杨思琦 committed
127
    opacity: 1;
128 129 130 131 132 133
  }
}

@keyframes panel-retreat--rtl {
  0% {
    transform: translate3d(50px, 0, 0) scale(0.99);
杨思琦's avatar
杨思琦 committed
134
    opacity: 0;
135
  }
杨思琦's avatar
杨思琦 committed
136

137 138
  100% {
    transform: translate3d(0, 0, 0) scale(1);
杨思琦's avatar
杨思琦 committed
139
    opacity: 1;
140 141
  }
}