123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119 |
- <!DOCTYPE html>
- <html>
- <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 rel="icon" href="<%= BASE_URL %>favicon.ico">
- <title><%= webpackConfig.name %></title>
- <link rel='stylesheet' href='luckysheet/plugins/css/pluginsCss.css' />
- <link rel='stylesheet' href='luckysheet/plugins/plugins.css' />
- <link rel='stylesheet' href='luckysheet/css/luckysheet.css' />
- <link rel='stylesheet' href='luckysheet/assets/iconfont/iconfont.css' />
- <script src="luckysheet/plugins/js/plugin.js"></script>
- <script src="luckysheet/luckysheet.umd.js"></script>
- <style>
- html,
- body,
- #app {
- height: 100%;
- margin: 0px;
- padding: 0px;
- }
- #loader-wrapper {
- position: fixed;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- z-index: 999999;
- display: flex;
- flex-wrap: nowrap;
- align-content: center;
- justify-content: center;
- align-items: center;
- }
- #loader-wrapper .load_title {
- font-family: 'Open Sans';
- color: #FFF;
- font-size: 19px;
- width: 100%;
- text-align: center;
- z-index: 9999999999999;
- position: absolute;
- top: 49%;
- opacity: 1;
- line-height: 30px;
- }
- @keyframes mounthAni {
- 40% {
- stroke-dasharray: 44, 22;
- /* 间距改为1/4 */
- }
- 80%,
- 100% {
- stroke-dasharray: 44, 44;
- /* 间距恢复为1/2 */
- transform: rotate(720deg);
- }
- }
- @keyframes eyeAni {
- 40% {
- stroke-dasharray: 0, 77;
- /* 间距改为7/8 */
- }
- 80%,
- 100% {
- transform: rotate(675deg);
- /* 间距恢复为3/4 */
- stroke-dasharray: 0, 66;
- }
- }
- @keyframes dash {
- 0% {
- stroke-dashoffset: 2000;
- }
- 90% {
- stroke-dashoffset: 0;
- }
- }
- @keyframes loading22 {
- 60% {
- stroke-dashoffset: 1000;
- }
- 100% {
- stroke-dashoffset: 0;
- }
- }
- </style>
- </head>
- <body>
- <div id="app">
- <div id="loader-wrapper">
- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100px" height="100px"
- viewBox="0 0 40 40" enable-background="new 0 0 40 40" xml:space="preserve">
- <path opacity="0.2" fill="rgba(73,125,235,1)"
- d="M20.201,5.169c-8.254,0-14.946,6.692-14.946,14.946c0,8.255,6.692,14.946,14.946,14.946
- s14.946-6.691,14.946-14.946C35.146,11.861,28.455,5.169,20.201,5.169z M20.201,31.749c-6.425,0-11.634-5.208-11.634-11.634
- c0-6.425,5.209-11.634,11.634-11.634c6.425,0,11.633,5.209,11.633,11.634C31.834,26.541,26.626,31.749,20.201,31.749z"></path>
- <path fill="rgba(73,125,235,1)" d="M26.013,10.047l1.654-2.866c-2.198-1.272-4.743-2.012-7.466-2.012h0v3.312h0
- C22.32,8.481,24.301,9.057,26.013,10.047z" transform="rotate(42.1171 20 20)">
- <animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0 20 20"
- to="360 20 20" dur="0.5s" repeatCount="indefinite"></animateTransform>
- </path>
- </svg>
- </div>
- </div>
- </body>
- </html>
|