react-ant-admin_1
/
index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/src/assets/images/favicon.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>react-ant-admin</title>
    <meta name="description" content="此框架使用与二次开发，前端框架使用react，UI框架使用ant-design，全局数据状态管理使用redux，ajax使用库为axios。用于快速搭建中后台页面。">
    <meta name="keywords" content="react-ant-admin适用于快速搭建中后台页面，管理系统架构。react全家桶。admin管理系统">
    <style>
      .mesh-loader {
          overflow: hidden;
          height: 100vh;
          width: 100vw;
      }

      .mesh-loader .circle {
          width: 25px;
          height: 25px;
          position: absolute;
          background: #03A9F4;
          border-radius: 50%;
          margin: -12.5px;
          -webkit-animation: mesh 3s ease-in-out infinite;
          animation: mesh 3s ease-in-out infinite -1.5s;
      }

      .mesh-loader > div .circle:last-child {
          -webkit-animation-delay: 0s;
          animation-delay: 0s;
      }

      .mesh-loader > div {
          position: absolute;
          top: 50%;
          left: 50%;
      }

      .mesh-loader > div:last-child {
          -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
      }

      @-webkit-keyframes mesh {
        0% {
          -webkit-transform-origin: 50% -100%;
                  transform-origin: 50% -100%;
          -webkit-transform: rotate(0);
                  transform: rotate(0);
        }
        50% {
          -webkit-transform-origin: 50% -100%;
                  transform-origin: 50% -100%;
          -webkit-transform: rotate(360deg);
                  transform: rotate(360deg);
        }
        50.00001% {
          -webkit-transform-origin: 50% 200%;
                  transform-origin: 50% 200%;
          -webkit-transform: rotate(0deg);
                  transform: rotate(0deg);
        }
        100% {
          -webkit-transform-origin: 50% 200%;
                  transform-origin: 50% 200%;
          -webkit-transform: rotate(360deg);
                  transform: rotate(360deg);
        }
      }
      @keyframes mesh {
        0% {
          -webkit-transform-origin: 50% -100%;
                  transform-origin: 50% -100%;
          -webkit-transform: rotate(0);
                  transform: rotate(0);
        }
        50% {
          -webkit-transform-origin: 50% -100%;
                  transform-origin: 50% -100%;
          -webkit-transform: rotate(360deg);
                  transform: rotate(360deg);
        }
        50.00001% {
          -webkit-transform-origin: 50% 200%;
                  transform-origin: 50% 200%;
          -webkit-transform: rotate(0deg);
                  transform: rotate(0deg);
        }
        100% {
          -webkit-transform-origin: 50% 200%;
                  transform-origin: 50% 200%;
          -webkit-transform: rotate(360deg);
                  transform: rotate(360deg);
        }
      }
    </style>
    <script>
      var _hmt = _hmt || [];
      (function() {
        var hm = document.createElement("script");
        hm.src = "https://hm.baidu.com/hm.js?e3522da961ab5db57e945e810f2e3e33";
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(hm, s);
      })();
      </script>

  </head>
  <body>

    <div id="root">
      <div class="mesh-loader">
        <div class="set-one">
            <div class="circle"></div>
            <div class="circle"></div>
        </div>
        <div class="set-two">
            <div class="circle"></div>
            <div class="circle"></div>
        </div>
      </div>
    </div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
</html>