@zyzgroup/core-web 0.0.94 → 0.0.96

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (133) hide show
  1. package/dist/zyzgroup_core_web.iife.js +20 -20
  2. package/dist/zyzgroup_core_web.iife.js.map +1 -1
  3. package/dist/zyzgroup_core_web.js +10500 -10883
  4. package/dist/zyzgroup_core_web.js.map +1 -1
  5. package/dist/zyzgroup_core_web.umd.cjs +20 -20
  6. package/dist/zyzgroup_core_web.umd.cjs.map +1 -1
  7. package/package.json +2 -1
  8. package/types/MVVM.d.ts +1 -0
  9. package/types/MVVM.d.ts.map +1 -1
  10. package/types/WebSocketClient.d.ts +20 -0
  11. package/types/WebSocketClient.d.ts.map +1 -0
  12. package/types/animate/_YZAnimate.d.ts.map +1 -1
  13. package/types/audio/audio.d.ts +2 -0
  14. package/types/audio/audio.d.ts.map +1 -0
  15. package/types/axios.d.ts.map +1 -1
  16. package/types/canvas/YZCanvas.d.ts.map +1 -1
  17. package/types/dom/DOMEventBus.d.ts +0 -1
  18. package/types/dom/DOMEventBus.d.ts.map +1 -1
  19. package/types/dom/DOMParse.d.ts.map +1 -1
  20. package/types/dom/index.d.ts +1 -1
  21. package/types/dom/index.d.ts.map +1 -1
  22. package/types/dom/parseCSS.d.ts +3 -0
  23. package/types/dom/parseCSS.d.ts.map +1 -0
  24. package/types/error.d.ts +5 -0
  25. package/types/error.d.ts.map +1 -0
  26. package/types/file.d.ts +4 -5
  27. package/types/file.d.ts.map +1 -1
  28. package/types/hooks/index.d.ts +11 -3
  29. package/types/hooks/index.d.ts.map +1 -1
  30. package/types/hooks/useClickA.d.ts +2 -0
  31. package/types/hooks/useClickA.d.ts.map +1 -0
  32. package/types/hooks/useCookie.d.ts.map +1 -1
  33. package/types/hooks/useElement.d.ts +18 -4
  34. package/types/hooks/useElement.d.ts.map +1 -1
  35. package/types/hooks/useFetch.d.ts +9 -0
  36. package/types/hooks/useFetch.d.ts.map +1 -0
  37. package/types/hooks/useHistoryRouter.d.ts +5 -0
  38. package/types/hooks/useHistoryRouter.d.ts.map +1 -0
  39. package/types/hooks/useIframe.d.ts +2 -0
  40. package/types/hooks/useIframe.d.ts.map +1 -0
  41. package/types/hooks/useIndexDB.d.ts +3 -0
  42. package/types/hooks/useIndexDB.d.ts.map +1 -0
  43. package/types/hooks/useLoadImage.d.ts +9 -0
  44. package/types/hooks/useLoadImage.d.ts.map +1 -0
  45. package/types/hooks/useLoadLink.d.ts +1 -1
  46. package/types/hooks/useLoadLink.d.ts.map +1 -1
  47. package/types/hooks/useLoadScript.d.ts +1 -1
  48. package/types/hooks/useLoadScript.d.ts.map +1 -1
  49. package/types/hooks/useLocalStorage.d.ts.map +1 -1
  50. package/types/hooks/useLocale/locales/en.d.ts +8 -0
  51. package/types/hooks/useLocale/locales/en.d.ts.map +1 -0
  52. package/types/hooks/useLocale/locales/zh-cn.d.ts +41 -0
  53. package/types/hooks/useLocale/locales/zh-cn.d.ts.map +1 -0
  54. package/types/hooks/useLocale/useLocale.d.ts +10 -0
  55. package/types/hooks/useLocale/useLocale.d.ts.map +1 -0
  56. package/types/hooks/useMouse.d.ts +3 -0
  57. package/types/hooks/useMouse.d.ts.map +1 -0
  58. package/types/hooks/useObjectURL.d.ts +2 -1
  59. package/types/hooks/useObjectURL.d.ts.map +1 -1
  60. package/types/hooks/useResize.d.ts +3 -8
  61. package/types/hooks/useResize.d.ts.map +1 -1
  62. package/types/hooks/useScroll.d.ts.map +1 -1
  63. package/types/hooks/useSelectFile.d.ts +12 -2
  64. package/types/hooks/useSelectFile.d.ts.map +1 -1
  65. package/types/hooks/useSessionStorage.d.ts +4 -0
  66. package/types/hooks/useSessionStorage.d.ts.map +1 -0
  67. package/types/hooks/useStyle.d.ts +1 -0
  68. package/types/hooks/useStyle.d.ts.map +1 -1
  69. package/types/hooks/useVnode.d.ts.map +1 -1
  70. package/types/hooks/useWindow.d.ts +18 -0
  71. package/types/hooks/useWindow.d.ts.map +1 -0
  72. package/types/image/UPNG.d.ts +1 -1
  73. package/types/image/UPNG.d.ts.map +1 -1
  74. package/types/image/image.d.ts +2 -28
  75. package/types/image/image.d.ts.map +1 -1
  76. package/types/index.d.ts +2 -2
  77. package/types/index.d.ts.map +1 -1
  78. package/types/math/Matrix.d.ts.map +1 -1
  79. package/types/math/math.d.ts.map +1 -1
  80. package/types/math/shapes/Text.d.ts +5 -0
  81. package/types/math/shapes/Text.d.ts.map +1 -1
  82. package/types/svg/SVGParse.d.ts +1 -1
  83. package/types/svg/SVGParse.d.ts.map +1 -1
  84. package/types/svg/YZSVG.d.ts +2 -0
  85. package/types/svg/YZSVG.d.ts.map +1 -1
  86. package/types/theme.d.ts +2 -0
  87. package/types/theme.d.ts.map +1 -1
  88. package/types/url.d.ts +6 -15
  89. package/types/url.d.ts.map +1 -1
  90. package/types/vnode.d.ts.map +1 -1
  91. package/dist/D-DINCondensed-number.ttf +0 -0
  92. package/dist/D-DINExp.ttf +0 -0
  93. package/dist/animate.css +0 -4074
  94. package/dist/animate.min.css +0 -8
  95. package/dist/animate_ce.css +0 -2206
  96. package/dist/better.css +0 -433
  97. package/dist/effects.css +0 -20
  98. package/dist/flex.css +0 -105
  99. package/dist/font.css +0 -43
  100. package/dist/grid.css +0 -193
  101. package/dist/rem_1080.css +0 -81
  102. package/dist/rem_1920.css +0 -81
  103. package/dist/rem_640.css +0 -61
  104. package/dist/rem_720.css +0 -66
  105. package/dist/rem_750.css +0 -71
  106. package/dist/tailwind.css +0 -3
  107. package/dist/theme.css +0 -62
  108. package/types/dom/DOMUtil.d.ts +0 -46
  109. package/types/dom/DOMUtil.d.ts.map +0 -1
  110. package/types/hooks/useLinkExport.d.ts +0 -3
  111. package/types/hooks/useLinkExport.d.ts.map +0 -1
  112. package/types/hooks/useWindowChange.d.ts +0 -13
  113. package/types/hooks/useWindowChange.d.ts.map +0 -1
  114. package/types/jsonp.d.ts +0 -17
  115. package/types/jsonp.d.ts.map +0 -1
  116. package/types/loaders/AudioLoader.d.ts +0 -12
  117. package/types/loaders/AudioLoader.d.ts.map +0 -1
  118. package/types/loaders/Cache.d.ts +0 -10
  119. package/types/loaders/Cache.d.ts.map +0 -1
  120. package/types/loaders/FileLoader.d.ts +0 -16
  121. package/types/loaders/FileLoader.d.ts.map +0 -1
  122. package/types/loaders/ImageBitmapLoader.d.ts +0 -14
  123. package/types/loaders/ImageBitmapLoader.d.ts.map +0 -1
  124. package/types/loaders/ImageLoader.d.ts +0 -11
  125. package/types/loaders/ImageLoader.d.ts.map +0 -1
  126. package/types/loaders/Loader.d.ts +0 -25
  127. package/types/loaders/Loader.d.ts.map +0 -1
  128. package/types/loaders/LoadingManager.d.ts +0 -29
  129. package/types/loaders/LoadingManager.d.ts.map +0 -1
  130. package/types/loaders/index.d.ts +0 -5
  131. package/types/loaders/index.d.ts.map +0 -1
  132. package/types/websocketclient.d.ts +0 -22
  133. package/types/websocketclient.d.ts.map +0 -1
@@ -1,2206 +0,0 @@
1
- @keyframes rotate {
2
- 0% {
3
- transform: rotate(0deg);
4
- }
5
- 100% {
6
- transform: rotate(360deg);
7
- }
8
- }
9
-
10
- @keyframes rotate-reverse {
11
- 0% {
12
- transform: rotate(360deg);
13
- }
14
- 100% {
15
- transform: rotate(0deg);
16
- }
17
- }
18
-
19
- @keyframes jelly {
20
- 0%,
21
- 100% {
22
- transform: scale(1, 1);
23
- }
24
- 25% {
25
- transform: scale(0.9, 1.1);
26
- }
27
- 50% {
28
- transform: scale(1.1, 0.9);
29
- }
30
- 75% {
31
- transform: scale(0.95, 1.05);
32
- }
33
- }
34
-
35
- @keyframes bounce {
36
- from,
37
- 20%,
38
- 53%,
39
- to {
40
- animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
41
- transform: translate3d(0, 0, 0);
42
- }
43
-
44
- 40%,
45
- 43% {
46
- animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
47
- transform: translate3d(0, -30px, 0) scaleY(1.1);
48
- }
49
-
50
- 70% {
51
- animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
52
- transform: translate3d(0, -15px, 0) scaleY(1.05);
53
- }
54
-
55
- 80% {
56
- transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
57
- transform: translate3d(0, 0, 0) scaleY(0.95);
58
- }
59
-
60
- 90% {
61
- transform: translate3d(0, -4px, 0) scaleY(1.02);
62
- }
63
- }
64
-
65
- @keyframes flash {
66
- from,
67
- 50%,
68
- to {
69
- opacity: 1;
70
- }
71
-
72
- 25%,
73
- 75% {
74
- opacity: 0;
75
- }
76
- }
77
-
78
- @keyframes pulse {
79
- from {
80
- transform: scale3d(1, 1, 1);
81
- }
82
-
83
- 50% {
84
- transform: scale3d(1.05, 1.05, 1.05);
85
- }
86
-
87
- to {
88
- transform: scale3d(1, 1, 1);
89
- }
90
- }
91
-
92
- @keyframes rubberBand {
93
- from {
94
- transform: scale3d(1, 1, 1);
95
- }
96
-
97
- 30% {
98
- transform: scale3d(1.25, 0.75, 1);
99
- }
100
-
101
- 40% {
102
- transform: scale3d(0.75, 1.25, 1);
103
- }
104
-
105
- 50% {
106
- transform: scale3d(1.15, 0.85, 1);
107
- }
108
-
109
- 65% {
110
- transform: scale3d(0.95, 1.05, 1);
111
- }
112
-
113
- 75% {
114
- transform: scale3d(1.05, 0.95, 1);
115
- }
116
-
117
- to {
118
- transform: scale3d(1, 1, 1);
119
- }
120
- }
121
-
122
- @keyframes shakeX {
123
- from,
124
- to {
125
- transform: translate3d(0, 0, 0);
126
- }
127
-
128
- 10%,
129
- 30%,
130
- 50%,
131
- 70%,
132
- 90% {
133
- transform: translate3d(-10px, 0, 0);
134
- }
135
-
136
- 20%,
137
- 40%,
138
- 60%,
139
- 80% {
140
- transform: translate3d(10px, 0, 0);
141
- }
142
- }
143
-
144
- @keyframes shakeY {
145
- from,
146
- to {
147
- transform: translate3d(0, 0, 0);
148
- }
149
-
150
- 10%,
151
- 30%,
152
- 50%,
153
- 70%,
154
- 90% {
155
- transform: translate3d(0, -10px, 0);
156
- }
157
-
158
- 20%,
159
- 40%,
160
- 60%,
161
- 80% {
162
- transform: translate3d(0, 10px, 0);
163
- }
164
- }
165
-
166
- @keyframes headShake {
167
- 0% {
168
- transform: translateX(0);
169
- }
170
-
171
- 6.5% {
172
- transform: translateX(-6px) rotateY(-9deg);
173
- }
174
-
175
- 18.5% {
176
- transform: translateX(5px) rotateY(7deg);
177
- }
178
-
179
- 31.5% {
180
- transform: translateX(-3px) rotateY(-5deg);
181
- }
182
-
183
- 43.5% {
184
- transform: translateX(2px) rotateY(3deg);
185
- }
186
-
187
- 50% {
188
- transform: translateX(0);
189
- }
190
- }
191
-
192
- @keyframes swing {
193
- 20% {
194
- transform: rotate3d(0, 0, 1, 15deg);
195
- }
196
-
197
- 40% {
198
- transform: rotate3d(0, 0, 1, -10deg);
199
- }
200
-
201
- 60% {
202
- transform: rotate3d(0, 0, 1, 5deg);
203
- }
204
-
205
- 80% {
206
- transform: rotate3d(0, 0, 1, -5deg);
207
- }
208
-
209
- to {
210
- transform: rotate3d(0, 0, 1, 0deg);
211
- }
212
- }
213
-
214
- @keyframes tada {
215
- from {
216
- transform: scale3d(1, 1, 1);
217
- }
218
-
219
- 10%,
220
- 20% {
221
- transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
222
- }
223
-
224
- 30%,
225
- 50%,
226
- 70%,
227
- 90% {
228
- transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
229
- }
230
-
231
- 40%,
232
- 60%,
233
- 80% {
234
- transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
235
- }
236
-
237
- to {
238
- transform: scale3d(1, 1, 1);
239
- }
240
- }
241
-
242
- @keyframes wobble {
243
- from {
244
- transform: translate3d(0, 0, 0);
245
- }
246
-
247
- 15% {
248
- transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
249
- }
250
-
251
- 30% {
252
- transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
253
- }
254
-
255
- 45% {
256
- transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
257
- }
258
-
259
- 60% {
260
- transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
261
- }
262
-
263
- 75% {
264
- transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
265
- }
266
-
267
- to {
268
- transform: translate3d(0, 0, 0);
269
- }
270
- }
271
-
272
- @keyframes jello {
273
- from,
274
- 11.1%,
275
- to {
276
- transform: translate3d(0, 0, 0);
277
- }
278
-
279
- 22.2% {
280
- transform: skewX(-12.5deg) skewY(-12.5deg);
281
- }
282
-
283
- 33.3% {
284
- transform: skewX(6.25deg) skewY(6.25deg);
285
- }
286
-
287
- 44.4% {
288
- transform: skewX(-3.125deg) skewY(-3.125deg);
289
- }
290
-
291
- 55.5% {
292
- transform: skewX(1.5625deg) skewY(1.5625deg);
293
- }
294
-
295
- 66.6% {
296
- transform: skewX(-0.78125deg) skewY(-0.78125deg);
297
- }
298
-
299
- 77.7% {
300
- transform: skewX(0.390625deg) skewY(0.390625deg);
301
- }
302
-
303
- 88.8% {
304
- transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
305
- }
306
- }
307
-
308
- @keyframes heartBeat {
309
- 0% {
310
- transform: scale(1);
311
- }
312
-
313
- 14% {
314
- transform: scale(1.3);
315
- }
316
-
317
- 28% {
318
- transform: scale(1);
319
- }
320
-
321
- 42% {
322
- transform: scale(1.3);
323
- }
324
-
325
- 70% {
326
- transform: scale(1);
327
- }
328
- }
329
-
330
- @keyframes backInLeft {
331
- 0% {
332
- transform: translateX(-2000px) scale(0.7);
333
- opacity: 0.7;
334
- }
335
-
336
- 80% {
337
- transform: translateX(0px) scale(0.7);
338
- opacity: 0.7;
339
- }
340
-
341
- 100% {
342
- transform: scale(1);
343
- opacity: 1;
344
- }
345
- }
346
- @keyframes backInRight {
347
- 0% {
348
- transform: translateX(2000px) scale(0.7);
349
- opacity: 0.7;
350
- }
351
-
352
- 80% {
353
- transform: translateX(0px) scale(0.7);
354
- opacity: 0.7;
355
- }
356
-
357
- 100% {
358
- transform: scale(1);
359
- opacity: 1;
360
- }
361
- }
362
-
363
- @keyframes backInUp {
364
- 0% {
365
- transform: translateY(1200px) scale(0.7);
366
- opacity: 0.7;
367
- }
368
-
369
- 80% {
370
- transform: translateY(0px) scale(0.7);
371
- opacity: 0.7;
372
- }
373
-
374
- 100% {
375
- transform: scale(1);
376
- opacity: 1;
377
- }
378
- }
379
-
380
- @keyframes backInDown {
381
- 0% {
382
- transform: translateY(-1200px) scale(0.7);
383
- opacity: 0.7;
384
- }
385
-
386
- 80% {
387
- transform: translateY(0px) scale(0.7);
388
- opacity: 0.7;
389
- }
390
-
391
- 100% {
392
- transform: scale(1);
393
- opacity: 1;
394
- }
395
- }
396
-
397
- @keyframes backOutLeft {
398
- 0% {
399
- transform: scale(1);
400
- opacity: 1;
401
- }
402
-
403
- 20% {
404
- transform: translateX(0px) scale(0.7);
405
- opacity: 0.7;
406
- }
407
-
408
- 100% {
409
- transform: translateX(-2000px) scale(0.7);
410
- opacity: 0.7;
411
- }
412
- }
413
-
414
- @keyframes backOutRight {
415
- 0% {
416
- transform: scale(1);
417
- opacity: 1;
418
- }
419
-
420
- 20% {
421
- transform: translateX(0px) scale(0.7);
422
- opacity: 0.7;
423
- }
424
-
425
- 100% {
426
- transform: translateX(2000px) scale(0.7);
427
- opacity: 0.7;
428
- }
429
- }
430
-
431
- @keyframes backOutUp {
432
- 0% {
433
- transform: scale(1);
434
- opacity: 1;
435
- }
436
-
437
- 20% {
438
- transform: translateY(0px) scale(0.7);
439
- opacity: 0.7;
440
- }
441
-
442
- 100% {
443
- transform: translateY(-700px) scale(0.7);
444
- opacity: 0.7;
445
- }
446
- }
447
-
448
- @keyframes backOutDown {
449
- 0% {
450
- transform: scale(1);
451
- opacity: 1;
452
- }
453
-
454
- 20% {
455
- transform: translateY(0px) scale(0.7);
456
- opacity: 0.7;
457
- }
458
-
459
- 100% {
460
- transform: translateY(700px) scale(0.7);
461
- opacity: 0.7;
462
- }
463
- }
464
-
465
- @keyframes bounceIn {
466
- from,
467
- 20%,
468
- 40%,
469
- 60%,
470
- 80%,
471
- to {
472
- animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
473
- }
474
-
475
- 0% {
476
- opacity: 0;
477
- transform: scale3d(0.3, 0.3, 0.3);
478
- }
479
-
480
- 20% {
481
- transform: scale3d(1.1, 1.1, 1.1);
482
- }
483
-
484
- 40% {
485
- transform: scale3d(0.9, 0.9, 0.9);
486
- }
487
-
488
- 60% {
489
- opacity: 1;
490
- transform: scale3d(1.03, 1.03, 1.03);
491
- }
492
-
493
- 80% {
494
- transform: scale3d(0.97, 0.97, 0.97);
495
- }
496
-
497
- to {
498
- opacity: 1;
499
- transform: scale3d(1, 1, 1);
500
- }
501
- }
502
-
503
- @keyframes bounceInLeft {
504
- from,
505
- 60%,
506
- 75%,
507
- 90%,
508
- to {
509
- animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
510
- }
511
-
512
- 0% {
513
- opacity: 0;
514
- transform: translate3d(-3000px, 0, 0) scaleX(3);
515
- }
516
-
517
- 60% {
518
- opacity: 1;
519
- transform: translate3d(25px, 0, 0) scaleX(1);
520
- }
521
-
522
- 75% {
523
- transform: translate3d(-10px, 0, 0) scaleX(0.98);
524
- }
525
-
526
- 90% {
527
- transform: translate3d(5px, 0, 0) scaleX(0.995);
528
- }
529
-
530
- to {
531
- transform: translate3d(0, 0, 0);
532
- }
533
- }
534
-
535
- @keyframes bounceInRight {
536
- from,
537
- 60%,
538
- 75%,
539
- 90%,
540
- to {
541
- animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
542
- }
543
-
544
- from {
545
- opacity: 0;
546
- transform: translate3d(3000px, 0, 0) scaleX(3);
547
- }
548
-
549
- 60% {
550
- opacity: 1;
551
- transform: translate3d(-25px, 0, 0) scaleX(1);
552
- }
553
-
554
- 75% {
555
- transform: translate3d(10px, 0, 0) scaleX(0.98);
556
- }
557
-
558
- 90% {
559
- transform: translate3d(-5px, 0, 0) scaleX(0.995);
560
- }
561
-
562
- to {
563
- transform: translate3d(0, 0, 0);
564
- }
565
- }
566
-
567
- @keyframes bounceInUp {
568
- from,
569
- 60%,
570
- 75%,
571
- 90%,
572
- to {
573
- animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
574
- }
575
-
576
- from {
577
- opacity: 0;
578
- transform: translate3d(0, 3000px, 0) scaleY(5);
579
- }
580
-
581
- 60% {
582
- opacity: 1;
583
- transform: translate3d(0, -20px, 0) scaleY(0.9);
584
- }
585
-
586
- 75% {
587
- transform: translate3d(0, 10px, 0) scaleY(0.95);
588
- }
589
-
590
- 90% {
591
- transform: translate3d(0, -5px, 0) scaleY(0.985);
592
- }
593
-
594
- to {
595
- transform: translate3d(0, 0, 0);
596
- }
597
- }
598
-
599
- @keyframes bounceInDown {
600
- from,
601
- 60%,
602
- 75%,
603
- 90%,
604
- to {
605
- animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
606
- }
607
-
608
- 0% {
609
- opacity: 0;
610
- transform: translate3d(0, -3000px, 0) scaleY(3);
611
- }
612
-
613
- 60% {
614
- opacity: 1;
615
- transform: translate3d(0, 25px, 0) scaleY(0.9);
616
- }
617
-
618
- 75% {
619
- transform: translate3d(0, -10px, 0) scaleY(0.95);
620
- }
621
-
622
- 90% {
623
- transform: translate3d(0, 5px, 0) scaleY(0.985);
624
- }
625
-
626
- to {
627
- transform: translate3d(0, 0, 0);
628
- }
629
- }
630
-
631
- @keyframes bounceOut {
632
- 20% {
633
- transform: scale3d(0.9, 0.9, 0.9);
634
- }
635
-
636
- 50%,
637
- 55% {
638
- opacity: 1;
639
- transform: scale3d(1.1, 1.1, 1.1);
640
- }
641
-
642
- to {
643
- opacity: 0;
644
- transform: scale3d(0.3, 0.3, 0.3);
645
- }
646
- }
647
-
648
- @keyframes bounceOutLeft {
649
- 20% {
650
- opacity: 1;
651
- transform: translate3d(20px, 0, 0) scaleX(0.9);
652
- }
653
-
654
- to {
655
- opacity: 0;
656
- transform: translate3d(-2000px, 0, 0) scaleX(2);
657
- }
658
- }
659
-
660
- @keyframes bounceOutRight {
661
- 20% {
662
- opacity: 1;
663
- transform: translate3d(-20px, 0, 0) scaleX(0.9);
664
- }
665
-
666
- to {
667
- opacity: 0;
668
- transform: translate3d(2000px, 0, 0) scaleX(2);
669
- }
670
- }
671
-
672
- @keyframes bounceOutUp {
673
- 20% {
674
- transform: translate3d(0, -10px, 0) scaleY(0.985);
675
- }
676
-
677
- 40%,
678
- 45% {
679
- opacity: 1;
680
- transform: translate3d(0, 20px, 0) scaleY(0.9);
681
- }
682
-
683
- to {
684
- opacity: 0;
685
- transform: translate3d(0, -2000px, 0) scaleY(3);
686
- }
687
- }
688
-
689
- @keyframes bounceOutDown {
690
- 20% {
691
- transform: translate3d(0, 10px, 0) scaleY(0.985);
692
- }
693
-
694
- 40%,
695
- 45% {
696
- opacity: 1;
697
- transform: translate3d(0, -20px, 0) scaleY(0.9);
698
- }
699
-
700
- to {
701
- opacity: 0;
702
- transform: translate3d(0, 2000px, 0) scaleY(3);
703
- }
704
- }
705
-
706
- @keyframes fadeIn {
707
- from {
708
- opacity: 0;
709
- }
710
-
711
- to {
712
- opacity: 1;
713
- }
714
- }
715
-
716
- @keyframes fadeInLeft {
717
- from {
718
- opacity: 0;
719
- transform: translate3d(-100%, 0, 0);
720
- }
721
-
722
- to {
723
- opacity: 1;
724
- transform: translate3d(0, 0, 0);
725
- }
726
- }
727
-
728
- @keyframes fadeInLeftBig {
729
- from {
730
- opacity: 0;
731
- transform: translate3d(-2000px, 0, 0);
732
- }
733
-
734
- to {
735
- opacity: 1;
736
- transform: translate3d(0, 0, 0);
737
- }
738
- }
739
-
740
- @keyframes fadeInRight {
741
- from {
742
- opacity: 0;
743
- transform: translate3d(100%, 0, 0);
744
- }
745
-
746
- to {
747
- opacity: 1;
748
- transform: translate3d(0, 0, 0);
749
- }
750
- }
751
-
752
- @keyframes fadeInRightBig {
753
- from {
754
- opacity: 0;
755
- transform: translate3d(2000px, 0, 0);
756
- }
757
-
758
- to {
759
- opacity: 1;
760
- transform: translate3d(0, 0, 0);
761
- }
762
- }
763
-
764
- @keyframes fadeInUp {
765
- from {
766
- opacity: 0;
767
- transform: translate3d(0, 100%, 0);
768
- }
769
-
770
- to {
771
- opacity: 1;
772
- transform: translate3d(0, 0, 0);
773
- }
774
- }
775
-
776
- @keyframes fadeInUpBig {
777
- from {
778
- opacity: 0;
779
- transform: translate3d(0, 2000px, 0);
780
- }
781
-
782
- to {
783
- opacity: 1;
784
- transform: translate3d(0, 0, 0);
785
- }
786
- }
787
-
788
- @keyframes fadeInDown {
789
- from {
790
- opacity: 0;
791
- transform: translate3d(0, -100%, 0);
792
- }
793
-
794
- to {
795
- opacity: 1;
796
- transform: translate3d(0, 0, 0);
797
- }
798
- }
799
-
800
- @keyframes fadeInDownBig {
801
- from {
802
- opacity: 0;
803
- transform: translate3d(0, -2000px, 0);
804
- }
805
-
806
- to {
807
- opacity: 1;
808
- transform: translate3d(0, 0, 0);
809
- }
810
- }
811
-
812
- @keyframes fadeInTopLeft {
813
- from {
814
- opacity: 0;
815
- transform: translate3d(-100%, -100%, 0);
816
- }
817
- to {
818
- opacity: 1;
819
- transform: translate3d(0, 0, 0);
820
- }
821
- }
822
-
823
- @keyframes fadeInTopRight {
824
- from {
825
- opacity: 0;
826
- transform: translate3d(100%, -100%, 0);
827
- }
828
- to {
829
- opacity: 1;
830
- transform: translate3d(0, 0, 0);
831
- }
832
- }
833
-
834
- @keyframes fadeInBottomLeft {
835
- from {
836
- opacity: 0;
837
- transform: translate3d(-100%, 100%, 0);
838
- }
839
- to {
840
- opacity: 1;
841
- transform: translate3d(0, 0, 0);
842
- }
843
- }
844
-
845
- @keyframes fadeInBottomRight {
846
- from {
847
- opacity: 0;
848
- transform: translate3d(100%, 100%, 0);
849
- }
850
- to {
851
- opacity: 1;
852
- transform: translate3d(0, 0, 0);
853
- }
854
- }
855
-
856
- @keyframes fadeOut {
857
- from {
858
- opacity: 1;
859
- }
860
-
861
- to {
862
- opacity: 0;
863
- }
864
- }
865
-
866
- @keyframes fadeOutLeft {
867
- from {
868
- opacity: 1;
869
- }
870
-
871
- to {
872
- opacity: 0;
873
- transform: translate3d(-100%, 0, 0);
874
- }
875
- }
876
-
877
- @keyframes fadeOutLeftBig {
878
- from {
879
- opacity: 1;
880
- }
881
-
882
- to {
883
- opacity: 0;
884
- transform: translate3d(-2000px, 0, 0);
885
- }
886
- }
887
-
888
- @keyframes fadeOutRight {
889
- from {
890
- opacity: 1;
891
- }
892
-
893
- to {
894
- opacity: 0;
895
- transform: translate3d(100%, 0, 0);
896
- }
897
- }
898
-
899
- @keyframes fadeOutRightBig {
900
- from {
901
- opacity: 1;
902
- }
903
-
904
- to {
905
- opacity: 0;
906
- transform: translate3d(2000px, 0, 0);
907
- }
908
- }
909
-
910
- @keyframes fadeOutUp {
911
- from {
912
- opacity: 1;
913
- }
914
-
915
- to {
916
- opacity: 0;
917
- transform: translate3d(0, -100%, 0);
918
- }
919
- }
920
-
921
- @keyframes fadeOutUpBig {
922
- from {
923
- opacity: 1;
924
- }
925
-
926
- to {
927
- opacity: 0;
928
- transform: translate3d(0, -2000px, 0);
929
- }
930
- }
931
-
932
- @keyframes fadeOutDown {
933
- from {
934
- opacity: 1;
935
- }
936
-
937
- to {
938
- opacity: 0;
939
- transform: translate3d(0, 100%, 0);
940
- }
941
- }
942
-
943
- @keyframes fadeOutDownBig {
944
- from {
945
- opacity: 1;
946
- }
947
-
948
- to {
949
- opacity: 0;
950
- transform: translate3d(0, 2000px, 0);
951
- }
952
- }
953
-
954
- @keyframes fadeOutTopLeft {
955
- from {
956
- opacity: 1;
957
- transform: translate3d(0, 0, 0);
958
- }
959
- to {
960
- opacity: 0;
961
- transform: translate3d(-100%, -100%, 0);
962
- }
963
- }
964
-
965
- @keyframes fadeOutTopRight {
966
- from {
967
- opacity: 1;
968
- transform: translate3d(0, 0, 0);
969
- }
970
- to {
971
- opacity: 0;
972
- transform: translate3d(100%, -100%, 0);
973
- }
974
- }
975
-
976
- @keyframes fadeOutBottomRight {
977
- from {
978
- opacity: 1;
979
- transform: translate3d(0, 0, 0);
980
- }
981
- to {
982
- opacity: 0;
983
- transform: translate3d(100%, 100%, 0);
984
- }
985
- }
986
-
987
- @keyframes fadeOutBottomLeft {
988
- from {
989
- opacity: 1;
990
- transform: translate3d(0, 0, 0);
991
- }
992
- to {
993
- opacity: 0;
994
- transform: translate3d(-100%, 100%, 0);
995
- }
996
- }
997
-
998
- @keyframes flip {
999
- from {
1000
- transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
1001
- rotate3d(0, 1, 0, -360deg);
1002
- animation-timing-function: ease-out;
1003
- }
1004
-
1005
- 40% {
1006
- transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
1007
- rotate3d(0, 1, 0, -190deg);
1008
- animation-timing-function: ease-out;
1009
- }
1010
-
1011
- 50% {
1012
- transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
1013
- rotate3d(0, 1, 0, -170deg);
1014
- animation-timing-function: ease-in;
1015
- }
1016
-
1017
- 80% {
1018
- transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
1019
- rotate3d(0, 1, 0, 0deg);
1020
- animation-timing-function: ease-in;
1021
- }
1022
-
1023
- to {
1024
- transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
1025
- rotate3d(0, 1, 0, 0deg);
1026
- animation-timing-function: ease-in;
1027
- }
1028
- }
1029
-
1030
- @keyframes flipInX {
1031
- from {
1032
- transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1033
- animation-timing-function: ease-in;
1034
- opacity: 0;
1035
- }
1036
-
1037
- 40% {
1038
- transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1039
- animation-timing-function: ease-in;
1040
- }
1041
-
1042
- 60% {
1043
- transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
1044
- opacity: 1;
1045
- }
1046
-
1047
- 80% {
1048
- transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
1049
- }
1050
-
1051
- to {
1052
- transform: perspective(400px);
1053
- }
1054
- }
1055
-
1056
- @keyframes flipInY {
1057
- from {
1058
- transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1059
- animation-timing-function: ease-in;
1060
- opacity: 0;
1061
- }
1062
-
1063
- 40% {
1064
- transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
1065
- animation-timing-function: ease-in;
1066
- }
1067
-
1068
- 60% {
1069
- transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
1070
- opacity: 1;
1071
- }
1072
-
1073
- 80% {
1074
- transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
1075
- }
1076
-
1077
- to {
1078
- transform: perspective(400px);
1079
- }
1080
- }
1081
-
1082
- @keyframes flipOutX {
1083
- from {
1084
- transform: perspective(400px);
1085
- }
1086
-
1087
- 30% {
1088
- transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
1089
- opacity: 1;
1090
- }
1091
-
1092
- to {
1093
- transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
1094
- opacity: 0;
1095
- }
1096
- }
1097
-
1098
- @keyframes flipOutY {
1099
- from {
1100
- transform: perspective(400px);
1101
- }
1102
-
1103
- 30% {
1104
- transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
1105
- opacity: 1;
1106
- }
1107
-
1108
- to {
1109
- transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
1110
- opacity: 0;
1111
- }
1112
- }
1113
-
1114
- @keyframes flipOutRight {
1115
- to {
1116
- transform: translateZ(-1000px) rotateY(90deg);
1117
- opacity: 0.2;
1118
- }
1119
- }
1120
- @keyframes flipInLeft {
1121
- from {
1122
- transform: translateZ(-1000px) rotateY(-90deg);
1123
- opacity: 0.2;
1124
- }
1125
- }
1126
- @keyframes flipOutLeft {
1127
- to {
1128
- transform: translateZ(-1000px) rotateY(-90deg);
1129
- opacity: 0.2;
1130
- }
1131
- }
1132
- @keyframes flipInRight {
1133
- from {
1134
- transform: translateZ(-1000px) rotateY(90deg);
1135
- opacity: 0.2;
1136
- }
1137
- }
1138
- @keyframes flipOutTop {
1139
- to {
1140
- transform: translateZ(-1000px) rotateX(90deg);
1141
- opacity: 0.2;
1142
- }
1143
- }
1144
- @keyframes flipInBottom {
1145
- from {
1146
- transform: translateZ(-1000px) rotateX(-90deg);
1147
- opacity: 0.2;
1148
- }
1149
- }
1150
- @keyframes flipOutBottom {
1151
- to {
1152
- transform: translateZ(-1000px) rotateX(-90deg);
1153
- opacity: 0.2;
1154
- }
1155
- }
1156
- @keyframes flipInTop {
1157
- from {
1158
- transform: translateZ(-1000px) rotateX(90deg);
1159
- opacity: 0.2;
1160
- }
1161
- }
1162
-
1163
- @keyframes lightSpeedInLeft {
1164
- from {
1165
- transform: translate3d(-100%, 0, 0) skewX(30deg);
1166
- opacity: 0;
1167
- }
1168
-
1169
- 60% {
1170
- transform: skewX(-20deg);
1171
- opacity: 1;
1172
- }
1173
-
1174
- 80% {
1175
- transform: skewX(5deg);
1176
- }
1177
-
1178
- to {
1179
- transform: translate3d(0, 0, 0);
1180
- }
1181
- }
1182
-
1183
- @keyframes lightSpeedInRight {
1184
- from {
1185
- transform: translate3d(100%, 0, 0) skewX(-30deg);
1186
- opacity: 0;
1187
- }
1188
-
1189
- 60% {
1190
- transform: skewX(20deg);
1191
- opacity: 1;
1192
- }
1193
-
1194
- 80% {
1195
- transform: skewX(-5deg);
1196
- }
1197
-
1198
- to {
1199
- transform: translate3d(0, 0, 0);
1200
- }
1201
- }
1202
-
1203
- @keyframes lightSpeedOutLeft {
1204
- from {
1205
- opacity: 1;
1206
- }
1207
-
1208
- to {
1209
- transform: translate3d(-100%, 0, 0) skewX(-30deg);
1210
- opacity: 0;
1211
- }
1212
- }
1213
-
1214
- @keyframes lightSpeedOutRight {
1215
- from {
1216
- opacity: 1;
1217
- }
1218
-
1219
- to {
1220
- transform: translate3d(100%, 0, 0) skewX(30deg);
1221
- opacity: 0;
1222
- }
1223
- }
1224
-
1225
- @keyframes rotateIn {
1226
- from {
1227
- transform: rotate3d(0, 0, 1, -200deg);
1228
- opacity: 0;
1229
- }
1230
-
1231
- to {
1232
- transform: translate3d(0, 0, 0);
1233
- opacity: 1;
1234
- }
1235
- }
1236
-
1237
- @keyframes rotateInUpLeft {
1238
- from {
1239
- transform: rotate3d(0, 0, 1, 45deg);
1240
- opacity: 0;
1241
- }
1242
-
1243
- to {
1244
- transform: translate3d(0, 0, 0);
1245
- opacity: 1;
1246
- }
1247
- }
1248
-
1249
- @keyframes rotateInUpRight {
1250
- from {
1251
- transform: rotate3d(0, 0, 1, -90deg);
1252
- opacity: 0;
1253
- }
1254
-
1255
- to {
1256
- transform: translate3d(0, 0, 0);
1257
- opacity: 1;
1258
- }
1259
- }
1260
-
1261
- @keyframes rotateInDownLeft {
1262
- from {
1263
- transform: rotate3d(0, 0, 1, -45deg);
1264
- opacity: 0;
1265
- }
1266
-
1267
- to {
1268
- transform: translate3d(0, 0, 0);
1269
- opacity: 1;
1270
- }
1271
- }
1272
-
1273
- @keyframes rotateInDownRight {
1274
- from {
1275
- transform: rotate3d(0, 0, 1, 45deg);
1276
- opacity: 0;
1277
- }
1278
-
1279
- to {
1280
- transform: translate3d(0, 0, 0);
1281
- opacity: 1;
1282
- }
1283
- }
1284
-
1285
- @keyframes rotateOut {
1286
- from {
1287
- opacity: 1;
1288
- }
1289
-
1290
- to {
1291
- transform: rotate3d(0, 0, 1, 200deg);
1292
- opacity: 0;
1293
- }
1294
- }
1295
-
1296
- @keyframes rotateOutUpLeft {
1297
- from {
1298
- opacity: 1;
1299
- }
1300
-
1301
- to {
1302
- transform: rotate3d(0, 0, 1, -45deg);
1303
- opacity: 0;
1304
- }
1305
- }
1306
-
1307
- @keyframes rotateOutUpRight {
1308
- from {
1309
- opacity: 1;
1310
- }
1311
-
1312
- to {
1313
- transform: rotate3d(0, 0, 1, 90deg);
1314
- opacity: 0;
1315
- }
1316
- }
1317
-
1318
- @keyframes rotateOutDownLeft {
1319
- from {
1320
- opacity: 1;
1321
- }
1322
-
1323
- to {
1324
- transform: rotate3d(0, 0, 1, 45deg);
1325
- opacity: 0;
1326
- }
1327
- }
1328
-
1329
- @keyframes rotateOutDownRight {
1330
- from {
1331
- opacity: 1;
1332
- }
1333
-
1334
- to {
1335
- transform: rotate3d(0, 0, 1, -45deg);
1336
- opacity: 0;
1337
- }
1338
- }
1339
-
1340
- @keyframes hinge {
1341
- 0% {
1342
- animation-timing-function: ease-in-out;
1343
- }
1344
-
1345
- 20%,
1346
- 60% {
1347
- transform: rotate3d(0, 0, 1, 80deg);
1348
- animation-timing-function: ease-in-out;
1349
- }
1350
-
1351
- 40%,
1352
- 80% {
1353
- transform: rotate3d(0, 0, 1, 60deg);
1354
- animation-timing-function: ease-in-out;
1355
- opacity: 1;
1356
- }
1357
-
1358
- to {
1359
- transform: translate3d(0, 700px, 0);
1360
- opacity: 0;
1361
- }
1362
- }
1363
-
1364
- @keyframes rotateFall {
1365
- 0% {
1366
- transform: rotateZ(0deg);
1367
- }
1368
- 20% {
1369
- transform: rotateZ(10deg);
1370
- animation-timing-function: ease-out;
1371
- }
1372
- 40% {
1373
- transform: rotateZ(17deg);
1374
- }
1375
- 60% {
1376
- transform: rotateZ(16deg);
1377
- }
1378
- 100% {
1379
- transform: translateY(100%) rotateZ(17deg);
1380
- }
1381
- }
1382
-
1383
- @keyframes rotateOutNewspaper {
1384
- to {
1385
- transform: translateZ(-3000px) rotateZ(360deg);
1386
- opacity: 0;
1387
- }
1388
- }
1389
- @keyframes rotateInNewspaper {
1390
- from {
1391
- transform: translateZ(-3000px) rotateZ(-360deg);
1392
- opacity: 0;
1393
- }
1394
- }
1395
-
1396
- @keyframes jackInTheBox {
1397
- from {
1398
- opacity: 0;
1399
- transform: scale(0.1) rotate(30deg);
1400
- transform-origin: center bottom;
1401
- }
1402
-
1403
- 50% {
1404
- transform: rotate(-10deg);
1405
- }
1406
-
1407
- 70% {
1408
- transform: rotate(3deg);
1409
- }
1410
-
1411
- to {
1412
- opacity: 1;
1413
- transform: scale(1);
1414
- }
1415
- }
1416
-
1417
- @keyframes rollIn {
1418
- from {
1419
- opacity: 0;
1420
- transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
1421
- }
1422
-
1423
- to {
1424
- opacity: 1;
1425
- transform: translate3d(0, 0, 0);
1426
- }
1427
- }
1428
-
1429
- @keyframes rollOut {
1430
- from {
1431
- opacity: 1;
1432
- }
1433
-
1434
- to {
1435
- opacity: 0;
1436
- transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
1437
- }
1438
- }
1439
-
1440
- @keyframes zoomIn {
1441
- from {
1442
- opacity: 0;
1443
- transform: scale3d(0.3, 0.3, 0.3);
1444
- }
1445
-
1446
- 50% {
1447
- opacity: 1;
1448
- }
1449
- }
1450
-
1451
- @keyframes zoomInLeft {
1452
- from {
1453
- opacity: 0;
1454
- transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
1455
- animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
1456
- }
1457
-
1458
- 60% {
1459
- opacity: 1;
1460
- transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
1461
- animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
1462
- }
1463
- }
1464
-
1465
- @keyframes zoomInRight {
1466
- from {
1467
- opacity: 0;
1468
- transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
1469
- animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
1470
- }
1471
-
1472
- 60% {
1473
- opacity: 1;
1474
- transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
1475
- animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
1476
- }
1477
- }
1478
-
1479
- @keyframes zoomInUp {
1480
- from {
1481
- opacity: 0;
1482
- transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
1483
- animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
1484
- }
1485
-
1486
- 60% {
1487
- opacity: 1;
1488
- transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
1489
- animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
1490
- }
1491
- }
1492
-
1493
- @keyframes zoomInDown {
1494
- from {
1495
- opacity: 0;
1496
- transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
1497
- animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
1498
- }
1499
-
1500
- 60% {
1501
- opacity: 1;
1502
- transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
1503
- animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
1504
- }
1505
- }
1506
-
1507
- @keyframes zoomOut {
1508
- from {
1509
- opacity: 1;
1510
- }
1511
-
1512
- 50% {
1513
- opacity: 0;
1514
- transform: scale3d(0.3, 0.3, 0.3);
1515
- }
1516
-
1517
- to {
1518
- opacity: 0;
1519
- }
1520
- }
1521
-
1522
- @keyframes zoomOutLeft {
1523
- 40% {
1524
- opacity: 1;
1525
- transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
1526
- }
1527
-
1528
- to {
1529
- opacity: 0;
1530
- transform: scale(0.1) translate3d(-2000px, 0, 0);
1531
- }
1532
- }
1533
-
1534
- @keyframes zoomOutRight {
1535
- 40% {
1536
- opacity: 1;
1537
- transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
1538
- }
1539
-
1540
- to {
1541
- opacity: 0;
1542
- transform: scale(0.1) translate3d(2000px, 0, 0);
1543
- }
1544
- }
1545
-
1546
- @keyframes zoomOutUp {
1547
- 40% {
1548
- opacity: 1;
1549
- transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
1550
- animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
1551
- }
1552
-
1553
- to {
1554
- opacity: 0;
1555
- transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
1556
- animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
1557
- }
1558
- }
1559
-
1560
- @keyframes zoomOutDown {
1561
- 40% {
1562
- opacity: 1;
1563
- transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
1564
- animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
1565
- }
1566
-
1567
- to {
1568
- opacity: 0;
1569
- transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
1570
- animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
1571
- }
1572
- }
1573
-
1574
- @keyframes slideInLeft {
1575
- from {
1576
- transform: translate3d(-100%, 0, 0);
1577
- visibility: visible;
1578
- }
1579
-
1580
- to {
1581
- transform: translate3d(0, 0, 0);
1582
- }
1583
- }
1584
-
1585
- @keyframes slideInRight {
1586
- from {
1587
- transform: translate3d(100%, 0, 0);
1588
- visibility: visible;
1589
- }
1590
-
1591
- to {
1592
- transform: translate3d(0, 0, 0);
1593
- }
1594
- }
1595
-
1596
- @keyframes slideInUp {
1597
- from {
1598
- transform: translate3d(0, 100%, 0);
1599
- visibility: visible;
1600
- }
1601
-
1602
- to {
1603
- transform: translate3d(0, 0, 0);
1604
- }
1605
- }
1606
-
1607
- @keyframes slideInDown {
1608
- from {
1609
- transform: translate3d(0, -100%, 0);
1610
- visibility: visible;
1611
- }
1612
-
1613
- to {
1614
- transform: translate3d(0, 0, 0);
1615
- }
1616
- }
1617
-
1618
- @keyframes slideOutLeft {
1619
- from {
1620
- transform: translate3d(0, 0, 0);
1621
- }
1622
-
1623
- to {
1624
- visibility: hidden;
1625
- transform: translate3d(-100%, 0, 0);
1626
- }
1627
- }
1628
-
1629
- @keyframes slideOutRight {
1630
- from {
1631
- transform: translate3d(0, 0, 0);
1632
- }
1633
-
1634
- to {
1635
- visibility: hidden;
1636
- transform: translate3d(100%, 0, 0);
1637
- }
1638
- }
1639
-
1640
- @keyframes slideOutUp {
1641
- from {
1642
- transform: translate3d(0, 0, 0);
1643
- }
1644
-
1645
- to {
1646
- visibility: hidden;
1647
- transform: translate3d(0, -100%, 0);
1648
- }
1649
- }
1650
-
1651
- @keyframes slideOutDown {
1652
- from {
1653
- transform: translate3d(0, 0, 0);
1654
- }
1655
-
1656
- to {
1657
- visibility: hidden;
1658
- transform: translate3d(0, 100%, 0);
1659
- }
1660
- }
1661
-
1662
- @keyframes rotateRightSideFirst {
1663
- 40% {
1664
- transform: rotateY(15deg);
1665
- opacity: 0.8;
1666
- animation-timing-function: ease-out;
1667
- }
1668
- 100% {
1669
- transform: scale(0.8) translateZ(-200px);
1670
- opacity: 0;
1671
- }
1672
- }
1673
- @keyframes rotateLeftSideFirst {
1674
- 40% {
1675
- transform: rotateY(-15deg);
1676
- opacity: 0.8;
1677
- animation-timing-function: ease-out;
1678
- }
1679
- 100% {
1680
- transform: scale(0.8) translateZ(-200px);
1681
- opacity: 0;
1682
- }
1683
- }
1684
- @keyframes rotateTopSideFirst {
1685
- 40% {
1686
- transform: rotateX(15deg);
1687
- opacity: 0.8;
1688
- animation-timing-function: ease-out;
1689
- }
1690
- 100% {
1691
- transform: scale(0.8) translateZ(-200px);
1692
- opacity: 0;
1693
- }
1694
- }
1695
- @keyframes rotateBottomSideFirst {
1696
- 40% {
1697
- transform: rotateX(-15deg);
1698
- opacity: 0.8;
1699
- animation-timing-function: ease-out;
1700
- }
1701
- 100% {
1702
- transform: scale(0.8) translateZ(-200px);
1703
- opacity: 0;
1704
- }
1705
- }
1706
-
1707
- @keyframes rotatePushLeft {
1708
- to {
1709
- opacity: 0;
1710
- transform: rotateY(90deg);
1711
- }
1712
- }
1713
- @keyframes rotatePushRight {
1714
- to {
1715
- opacity: 0;
1716
- transform: rotateY(-90deg);
1717
- }
1718
- }
1719
- @keyframes rotatePushTop {
1720
- to {
1721
- opacity: 0;
1722
- transform: rotateX(-90deg);
1723
- }
1724
- }
1725
- @keyframes rotatePushBottom {
1726
- to {
1727
- opacity: 0;
1728
- transform: rotateX(90deg);
1729
- }
1730
- }
1731
- @keyframes rotatePullRight {
1732
- from {
1733
- opacity: 0;
1734
- transform: rotateY(-90deg);
1735
- }
1736
- }
1737
- @keyframes rotatePullLeft {
1738
- from {
1739
- opacity: 0;
1740
- transform: rotateY(90deg);
1741
- }
1742
- }
1743
- @keyframes rotatePullTop {
1744
- from {
1745
- opacity: 0;
1746
- transform: rotateX(-90deg);
1747
- }
1748
- }
1749
- @keyframes rotatePullBottom {
1750
- from {
1751
- opacity: 0;
1752
- transform: rotateX(90deg);
1753
- }
1754
- }
1755
-
1756
- @keyframes rotateFoldRight {
1757
- to {
1758
- opacity: 0;
1759
- transform: translateX(100%) rotateY(90deg);
1760
- }
1761
- }
1762
- @keyframes rotateFoldLeft {
1763
- to {
1764
- opacity: 0;
1765
- transform: translateX(-100%) rotateY(-90deg);
1766
- }
1767
- }
1768
- @keyframes rotateFoldTop {
1769
- to {
1770
- opacity: 0;
1771
- transform: translateY(-100%) rotateX(90deg);
1772
- }
1773
- }
1774
- @keyframes rotateFoldBottom {
1775
- to {
1776
- opacity: 0;
1777
- transform: translateY(100%) rotateX(-90deg);
1778
- }
1779
- }
1780
- @keyframes rotateUnfoldLeft {
1781
- from {
1782
- opacity: 0;
1783
- transform: translateX(-100%) rotateY(-90deg);
1784
- }
1785
- }
1786
- @keyframes rotateUnfoldRight {
1787
- from {
1788
- opacity: 0;
1789
- transform: translateX(100%) rotateY(90deg);
1790
- }
1791
- }
1792
- @keyframes rotateUnfoldTop {
1793
- from {
1794
- opacity: 0;
1795
- transform: translateY(-100%) rotateX(90deg);
1796
- }
1797
- }
1798
- @keyframes rotateUnfoldBottom {
1799
- from {
1800
- opacity: 0;
1801
- transform: translateY(100%) rotateX(-90deg);
1802
- }
1803
- }
1804
-
1805
- @keyframes moveToLeft {
1806
- to {
1807
- transform: translateX(-100%);
1808
- }
1809
- }
1810
- @keyframes moveFromLeft {
1811
- from {
1812
- transform: translateX(-100%);
1813
- }
1814
- }
1815
- @keyframes moveToRight {
1816
- to {
1817
- transform: translateX(100%);
1818
- }
1819
- }
1820
- @keyframes moveFromRight {
1821
- from {
1822
- transform: translateX(100%);
1823
- }
1824
- }
1825
- @keyframes moveToTop {
1826
- to {
1827
- transform: translateY(-100%);
1828
- }
1829
- }
1830
- @keyframes moveFromTop {
1831
- from {
1832
- transform: translateY(-100%);
1833
- }
1834
- }
1835
- @keyframes moveToBottom {
1836
- to {
1837
- transform: translateY(100%);
1838
- }
1839
- }
1840
- @keyframes moveFromBottom {
1841
- from {
1842
- transform: translateY(100%);
1843
- }
1844
- }
1845
-
1846
- @keyframes fade {
1847
- to {
1848
- opacity: 0.3;
1849
- }
1850
- }
1851
- @keyframes moveToLeftFade {
1852
- to {
1853
- opacity: 0.3;
1854
- transform: translateX(-100%);
1855
- }
1856
- }
1857
- @keyframes moveFromLeftFade {
1858
- from {
1859
- opacity: 0.3;
1860
- transform: translateX(-100%);
1861
- }
1862
- }
1863
- @keyframes moveToRightFade {
1864
- to {
1865
- opacity: 0.3;
1866
- transform: translateX(100%);
1867
- }
1868
- }
1869
- @keyframes moveFromRightFade {
1870
- from {
1871
- opacity: 0.3;
1872
- transform: translateX(100%);
1873
- }
1874
- }
1875
- @keyframes moveToTopFade {
1876
- to {
1877
- opacity: 0.3;
1878
- transform: translateY(-100%);
1879
- }
1880
- }
1881
- @keyframes moveFromTopFade {
1882
- from {
1883
- opacity: 0.3;
1884
- transform: translateY(-100%);
1885
- }
1886
- }
1887
- @keyframes moveToBottomFade {
1888
- to {
1889
- opacity: 0.3;
1890
- transform: translateY(100%);
1891
- }
1892
- }
1893
- @keyframes moveFromBottomFade {
1894
- from {
1895
- opacity: 0.3;
1896
- transform: translateY(100%);
1897
- }
1898
- }
1899
-
1900
- @keyframes scaleToSmall {
1901
- to {
1902
- opacity: 0;
1903
- transform: scale(0.8);
1904
- }
1905
- }
1906
- @keyframes scaleFromSmall {
1907
- from {
1908
- opacity: 0;
1909
- transform: scale(0.8);
1910
- }
1911
- }
1912
- @keyframes scaleFromLarge {
1913
- from {
1914
- opacity: 0;
1915
- transform: scale(1.2);
1916
- }
1917
- }
1918
- @keyframes scaleToLarge {
1919
- to {
1920
- opacity: 0;
1921
- transform: scale(1.2);
1922
- }
1923
- }
1924
- @keyframes scaleToSmallCenter {
1925
- to {
1926
- opacity: 0;
1927
- transform: scale(0.7);
1928
- }
1929
- }
1930
- @keyframes scaleFromSmallCenter {
1931
- from {
1932
- opacity: 0;
1933
- transform: scale(0.7);
1934
- }
1935
- }
1936
-
1937
- @keyframes rotateRoomLeftOut {
1938
- to {
1939
- opacity: 0.3;
1940
- transform: translateX(-100%) rotateY(90deg);
1941
- }
1942
- }
1943
- @keyframes rotateRoomLeftIn {
1944
- from {
1945
- opacity: 0.3;
1946
- transform: translateX(100%) rotateY(-90deg);
1947
- }
1948
- }
1949
- @keyframes rotateRoomRightOut {
1950
- to {
1951
- opacity: 0.3;
1952
- transform: translateX(100%) rotateY(-90deg);
1953
- }
1954
- }
1955
- @keyframes rotateRoomRightIn {
1956
- from {
1957
- opacity: 0.3;
1958
- transform: translateX(-100%) rotateY(90deg);
1959
- }
1960
- }
1961
- @keyframes rotateRoomTopOut {
1962
- to {
1963
- opacity: 0.3;
1964
- transform: translateY(-100%) rotateX(-90deg);
1965
- }
1966
- }
1967
- @keyframes rotateRoomTopIn {
1968
- from {
1969
- opacity: 0.3;
1970
- transform: translateY(100%) rotateX(90deg);
1971
- }
1972
- }
1973
- @keyframes rotateRoomBottomOut {
1974
- to {
1975
- opacity: 0.3;
1976
- transform: translateY(100%) rotateX(90deg);
1977
- }
1978
- }
1979
- @keyframes rotateRoomBottomIn {
1980
- from {
1981
- opacity: 0.3;
1982
- transform: translateY(-100%) rotateX(-90deg);
1983
- }
1984
- }
1985
-
1986
- @keyframes rotateCubeLeftOut {
1987
- 50% {
1988
- animation-timing-function: ease-out;
1989
- transform: translateX(-50%) translateZ(-200px) rotateY(-45deg);
1990
- }
1991
- 100% {
1992
- opacity: 0.3;
1993
- transform: translateX(-100%) rotateY(-90deg);
1994
- }
1995
- }
1996
- @keyframes rotateCubeLeftIn {
1997
- 0% {
1998
- opacity: 0.3;
1999
- transform: translateX(100%) rotateY(90deg);
2000
- }
2001
- 50% {
2002
- animation-timing-function: ease-out;
2003
- transform: translateX(50%) translateZ(-200px) rotateY(45deg);
2004
- }
2005
- }
2006
- @keyframes rotateCubeRightOut {
2007
- 50% {
2008
- animation-timing-function: ease-out;
2009
- transform: translateX(50%) translateZ(-200px) rotateY(45deg);
2010
- }
2011
- 100% {
2012
- opacity: 0.3;
2013
- transform: translateX(100%) rotateY(90deg);
2014
- }
2015
- }
2016
- @keyframes rotateCubeRightIn {
2017
- 0% {
2018
- opacity: 0.3;
2019
- transform: translateX(-100%) rotateY(-90deg);
2020
- }
2021
- 50% {
2022
- animation-timing-function: ease-out;
2023
- transform: translateX(-50%) translateZ(-200px) rotateY(-45deg);
2024
- }
2025
- }
2026
- @keyframes rotateCubeTopOut {
2027
- 50% {
2028
- animation-timing-function: ease-out;
2029
- transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
2030
- }
2031
- 100% {
2032
- opacity: 0.3;
2033
- transform: translateY(-100%) rotateX(90deg);
2034
- }
2035
- }
2036
- @keyframes rotateCubeTopIn {
2037
- 0% {
2038
- opacity: 0.3;
2039
- transform: translateY(100%) rotateX(-90deg);
2040
- }
2041
- 50% {
2042
- animation-timing-function: ease-out;
2043
- transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
2044
- }
2045
- }
2046
- @keyframes rotateCubeBottomOut {
2047
- 50% {
2048
- animation-timing-function: ease-out;
2049
- transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
2050
- }
2051
- 100% {
2052
- opacity: 0.3;
2053
- transform: translateY(100%) rotateX(-90deg);
2054
- }
2055
- }
2056
- @keyframes rotateCubeBottomIn {
2057
- 0% {
2058
- opacity: 0.3;
2059
- transform: translateY(-100%) rotateX(90deg);
2060
- }
2061
- 50% {
2062
- animation-timing-function: ease-out;
2063
- transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
2064
- }
2065
- }
2066
-
2067
- @keyframes rotateCarouselLeftOut {
2068
- to {
2069
- opacity: 0.3;
2070
- transform: translateX(-150%) scale(0.4) rotateY(-65deg);
2071
- }
2072
- }
2073
- @keyframes rotateCarouselLeftIn {
2074
- from {
2075
- opacity: 0.3;
2076
- transform: translateX(200%) scale(0.4) rotateY(65deg);
2077
- }
2078
- }
2079
- @keyframes rotateCarouselRightOut {
2080
- to {
2081
- opacity: 0.3;
2082
- transform: translateX(200%) scale(0.4) rotateY(65deg);
2083
- }
2084
- }
2085
- @keyframes rotateCarouselRightIn {
2086
- from {
2087
- opacity: 0.3;
2088
- transform: translateX(-200%) scale(0.4) rotateY(-65deg);
2089
- }
2090
- }
2091
- @keyframes rotateCarouselTopOut {
2092
- to {
2093
- opacity: 0.3;
2094
- transform: translateY(-200%) scale(0.4) rotateX(65deg);
2095
- }
2096
- }
2097
- @keyframes rotateCarouselTopIn {
2098
- from {
2099
- opacity: 0.3;
2100
- transform: translateY(200%) scale(0.4) rotateX(-65deg);
2101
- }
2102
- }
2103
- @keyframes rotateCarouselBottomOut {
2104
- to {
2105
- opacity: 0.3;
2106
- transform: translateY(200%) scale(0.4) rotateX(-65deg);
2107
- }
2108
- }
2109
- @keyframes rotateCarouselBottomIn {
2110
- from {
2111
- opacity: 0.3;
2112
- transform: translateY(-200%) scale(0.4) rotateX(65deg);
2113
- }
2114
- }
2115
-
2116
- @keyframes rotateSidesOut {
2117
- to {
2118
- opacity: 0;
2119
- transform: translateZ(-500px) rotateY(90deg);
2120
- }
2121
- }
2122
- @keyframes rotateSidesIn {
2123
- from {
2124
- opacity: 0;
2125
- transform: translateZ(-500px) rotateY(-90deg);
2126
- }
2127
- }
2128
-
2129
- @keyframes rotateSlideOut {
2130
- 25% {
2131
- opacity: 0.5;
2132
- transform: translateZ(-500px);
2133
- }
2134
- 75% {
2135
- opacity: 0.5;
2136
- transform: translateZ(-500px) translateX(-200%);
2137
- }
2138
- 100% {
2139
- opacity: 0.5;
2140
- transform: translateZ(-500px) translateX(-200%);
2141
- }
2142
- }
2143
- @keyframes rotateSlideIn {
2144
- 0%,
2145
- 25% {
2146
- opacity: 0.5;
2147
- transform: translateZ(-500px) translateX(200%);
2148
- }
2149
- 75% {
2150
- opacity: 0.5;
2151
- transform: translateZ(-500px);
2152
- }
2153
- 100% {
2154
- opacity: 1;
2155
- transform: translateZ(0) translateX(0);
2156
- }
2157
- }
2158
-
2159
- @keyframes superRainbow {
2160
- 0% {
2161
- background: red;
2162
- }
2163
- 20% {
2164
- background: orange;
2165
- }
2166
- 40% {
2167
- background: yellow;
2168
- }
2169
- 60% {
2170
- background: green;
2171
- }
2172
- 80% {
2173
- background: blue;
2174
- }
2175
- 100% {
2176
- background: violet;
2177
- }
2178
- }
2179
- .superRainbow {
2180
- background-position: 0 0;
2181
- background-size: 200% 100%;
2182
- background-image: linear-gradient(
2183
- 90deg,
2184
- red,
2185
- orange,
2186
- yellow,
2187
- green,
2188
- blue,
2189
- violet
2190
- );
2191
- }
2192
- .superRainbow:hover {
2193
- background-position: -100% 100%;
2194
- }
2195
-
2196
- @keyframes statusProcessing {
2197
- 0% {
2198
- transform: scale(0.8);
2199
- opacity: 0.5;
2200
- }
2201
-
2202
- 100% {
2203
- transform: scale(2.4);
2204
- opacity: 0;
2205
- }
2206
- }