index.html 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <script>
  4. var _hmt = _hmt || [];
  5. (function () {
  6. var hm = document.createElement("script");
  7. hm.src = "https://hm.baidu.com/hm.js?5689828a1ed41bac184cbfb451f4ba32";
  8. var s = document.getElementsByTagName("script")[0];
  9. s.parentNode.insertBefore(hm, s);
  10. })();
  11. </script>
  12. <head>
  13. <meta charset="UTF-8" />
  14. <link rel="icon" href="/logo_1.png" />
  15. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  16. <title>数据统计</title>
  17. <script src="/sortable.min.js"></script>
  18. <script>
  19. window.process = {};
  20. </script>
  21. </head>
  22. <body>
  23. <div id="app">
  24. <style>
  25. html,
  26. body,
  27. #app {
  28. width: 100%;
  29. height: 100%;
  30. display: flex;
  31. position: relative;
  32. justify-content: center;
  33. align-items: center;
  34. overflow: hidden;
  35. }
  36. .loader,
  37. .loader:before,
  38. .loader:after {
  39. border-radius: 50%;
  40. width: 2.5em;
  41. height: 2.5em;
  42. -webkit-animation-fill-mode: both;
  43. animation-fill-mode: both;
  44. -webkit-animation: loadAnimation 1.8s infinite ease-in-out;
  45. animation: loadAnimation 1.8s infinite ease-in-out;
  46. }
  47. .loader {
  48. color: #406eeb;
  49. font-size: 10px;
  50. margin: 80px auto;
  51. position: relative;
  52. text-indent: -9999em;
  53. -webkit-transform: translateZ(0);
  54. -ms-transform: translateZ(0);
  55. transform: translateZ(0);
  56. -webkit-animation-delay: -0.16s;
  57. animation-delay: -0.16s;
  58. top: 0;
  59. transform: translate(-50%, 0);
  60. }
  61. .loader:before,
  62. .loader:after {
  63. content: "";
  64. position: absolute;
  65. top: 0;
  66. }
  67. .loader:before {
  68. left: -3.5em;
  69. -webkit-animation-delay: -0.32s;
  70. animation-delay: -0.32s;
  71. }
  72. .loader:after {
  73. left: 3.5em;
  74. }
  75. @-webkit-keyframes loadAnimation {
  76. 0%,
  77. 80%,
  78. 100% {
  79. box-shadow: 0 2.5em 0 -1.3em;
  80. }
  81. 40% {
  82. box-shadow: 0 2.5em 0 0;
  83. }
  84. }
  85. @keyframes loadAnimation {
  86. 0%,
  87. 80%,
  88. 100% {
  89. box-shadow: 0 2.5em 0 -1.3em;
  90. }
  91. 40% {
  92. box-shadow: 0 2.5em 0 0;
  93. }
  94. }
  95. </style>
  96. <div class="loader"></div>
  97. </div>
  98. <script type="module" src="/src/main.ts"></script>
  99. </body>
  100. </html>