zhangbinhub-acp-admin
/
index.html

<!doctype html>
<html lang="zh">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="renderer" content="webkit" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
    <link href="/favicon.ico" rel="icon" />
    <title>Acp-Admin</title>
    <style>
      body {
        background-color: #1d1f20 !important;
        overflow: hidden;
      }

      .loader {
        animation: rotate 1s infinite;
        height: 50px;
        width: 50px;
        margin: 0 auto;
      }

      .loader:before,
      .loader:after {
        border-radius: 50%;
        content: '';
        display: block;
        height: 20px;
        width: 20px;
      }

      .loader:before {
        animation: ball1 1s infinite;
        background-color: #cb2025;
        box-shadow: 30px 0 0 #f8b334;
        margin-bottom: 10px;
      }

      .loader:after {
        animation: ball2 1s infinite;
        background-color: #00a096;
        box-shadow: 30px 0 0 #97bf0d;
      }

      @keyframes rotate {
        0% {
          -webkit-transform: rotate(0deg) scale(0.8);
          -moz-transform: rotate(0deg) scale(0.8);
        }
        50% {
          -webkit-transform: rotate(360deg) scale(1.2);
          -moz-transform: rotate(360deg) scale(1.2);
        }
        100% {
          -webkit-transform: rotate(720deg) scale(0.8);
          -moz-transform: rotate(720deg) scale(0.8);
        }
      }

      @keyframes ball1 {
        0% {
          box-shadow: 30px 0 0 #f8b334;
        }
        50% {
          box-shadow: 0 0 0 #f8b334;
          margin-bottom: 0;
          -webkit-transform: translate(15px, 15px);
          -moz-transform: translate(15px, 15px);
        }
        100% {
          box-shadow: 30px 0 0 #f8b334;
          margin-bottom: 10px;
        }
      }

      @keyframes ball2 {
        0% {
          box-shadow: 30px 0 0 #97bf0d;
        }
        50% {
          box-shadow: 0 0 0 #97bf0d;
          margin-top: -20px;
          -webkit-transform: translate(15px, 15px);
          -moz-transform: translate(15px, 15px);
        }
        100% {
          box-shadow: 30px 0 0 #97bf0d;
          margin-top: 0;
        }
      }
    </style>
  </head>
  <body>
    <div id="loading" style="margin-top: 200px">
      <div class="loader"></div>
    </div>
    <div id="app" class="global-size"></div>
    <script src="/src/main.js" type="module"></script>
    <script>
      window.onload = function () {
        document.getElementById('loading').style.display = 'none'
      }
    </script>
  </body>
</html>