first

2025-03-07 17:11:01 +08:00
commit 5850bdee94
66 changed files with 10952 additions and 0 deletions
@@ -0,0 +1,119 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+    <title><%- title %></title>
+    <style>
+      .first-loading-wrp {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        height: 90vh;
+        min-height: 90vh;
+      }
+      .first-loading-wrp>h1 {
+        font-size: 20px;
+      }
+      .first-loading-wrp .loading-wrp {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: 98px;
+      }
+      .dot {
+        position: relative;
+        box-sizing: border-box;
+        display: inline-block;
+        width: 64px;
+        height: 64px;
+        font-size: 64px;
+        transform: rotate(45deg);
+        animation: antRotate 1.2s infinite linear;
+      }
+      .dot i {
+        position: absolute;
+        display: block;
+        width: 28px;
+        height: 28px;
+        background-color:#43C9C3;
+        border-radius: 100%;
+        opacity: 0.5;
+        transform: scale(0.75);
+        transform-origin: 50% 50%;
+        animation: antSpinMove 1s infinite linear alternate;
+      }
+      .dot i:nth-child(1) {
+        top: 0;
+        left: 0;
+      }
+      .dot i:nth-child(2) {
+        top: 0;
+        right: 0;
+        -webkit-animation-delay: 0.4s;
+        animation-delay: 0.4s;
+      }
+   
+      .dot i:nth-child(3) {
+        right: 0;
+        bottom: 0;
+        -webkit-animation-delay: 0.8s;
+        animation-delay: 0.8s;
+      }
+   
+      .dot i:nth-child(4) {
+        bottom: 0;
+        left: 0;
+        -webkit-animation-delay: 1.2s;
+        animation-delay: 1.2s;
+      }
+   
+      @keyframes antRotate {
+        to {
+          -webkit-transform: rotate(405deg);
+          transform: rotate(405deg);
+        }
+      }
+   
+      @-webkit-keyframes antRotate {
+        to {
+          -webkit-transform: rotate(405deg);
+          transform: rotate(405deg);
+        }
+      }
+   
+      @keyframes antSpinMove {
+        to {
+          opacity: 1;
+        }
+      }
+   
+      @-webkit-keyframes antSpinMove {
+        to {
+          opacity: 1;
+        }
+      };
+      h2{
+        font-size: 16px!important;
+      }
+     </style>
+  </head>
+  <body>
+    <div id="app">
+      <div class="first-loading-wrp">
+        <div class="loading-wrp">
+          <span class="dot dot-spin">
+            <i></i>
+            <i></i>
+            <i></i>
+            <i></i>
+          </span>
+        </div>
+        <h2 style="font-size: 16px">努力加载中...</h2>
+    </div>
+    </div>
+    <script type="module" src="/src/main.js"></script>
+  </body>
+</html>