Skip to content

T
tp-ui
Commit beaea332 by jiang'yun
Options

修改

parent fd658ab6
Showing with 210 additions and 209 deletions
package.json
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
"name": "ruoyi", "name": "ruoyi",
"version": "3.8.8", "version": "3.8.8",
"description": "投选活动", "description": "投选活动",
"author": "若依", "author": "投选活动",
"license": "MIT", "license": "MIT",
"scripts": { "scripts": {
"dev": "vue-cli-service serve", "dev": "vue-cli-service serve",
......
public/favicon.ico
No preview for this file type
public/index.html
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="renderer" content="webkit"> <meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> <link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= webpackConfig.name %></title> <title><%= webpackConfig.name %></title>
<!--[if lt IE 11]><script>window.location.href='/html/ie.html';</script><![endif]--> <!--[if lt IE 11]><script>window.location.href='/html/ie.html';</script><![endif]-->
<style> <style>
html, html,
body, body,
#app { #app {
height: 100%; height: 100%;
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
} }
.chromeframe { .chromeframe {
margin: 0.2em 0; margin: 0.2em 0;
background: #ccc; background: #ccc;
color: #000; color: #000;
padding: 0.2em 0; padding: 0.2em 0;
} }
#loader-wrapper { #loader-wrapper {
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
z-index: 999999; z-index: 999999;
} }
#loader { #loader {
display: block; display: block;
position: relative; position: relative;
left: 50%; left: 50%;
top: 50%; top: 50%;
width: 150px; width: 150px;
height: 150px; height: 150px;
margin: -75px 0 0 -75px; margin: -75px 0 0 -75px;
border-radius: 50%; border-radius: 50%;
border: 3px solid transparent; border: 3px solid transparent;
border-top-color: #FFF; border-top-color: #FFF;
-webkit-animation: spin 2s linear infinite; -webkit-animation: spin 2s linear infinite;
-ms-animation: spin 2s linear infinite; -ms-animation: spin 2s linear infinite;
-moz-animation: spin 2s linear infinite; -moz-animation: spin 2s linear infinite;
-o-animation: spin 2s linear infinite; -o-animation: spin 2s linear infinite;
animation: spin 2s linear infinite; animation: spin 2s linear infinite;
z-index: 1001; z-index: 1001;
} }
#loader:before { #loader:before {
content: ""; content: "";
position: absolute; position: absolute;
top: 5px; top: 5px;
left: 5px; left: 5px;
right: 5px; right: 5px;
bottom: 5px; bottom: 5px;
border-radius: 50%; border-radius: 50%;
border: 3px solid transparent; border: 3px solid transparent;
border-top-color: #FFF; border-top-color: #FFF;
-webkit-animation: spin 3s linear infinite; -webkit-animation: spin 3s linear infinite;
-moz-animation: spin 3s linear infinite; -moz-animation: spin 3s linear infinite;
-o-animation: spin 3s linear infinite; -o-animation: spin 3s linear infinite;
-ms-animation: spin 3s linear infinite; -ms-animation: spin 3s linear infinite;
animation: spin 3s linear infinite; animation: spin 3s linear infinite;
} }
#loader:after { #loader:after {
content: ""; content: "";
position: absolute; position: absolute;
top: 15px; top: 15px;
left: 15px; left: 15px;
right: 15px; right: 15px;
bottom: 15px; bottom: 15px;
border-radius: 50%; border-radius: 50%;
border: 3px solid transparent; border: 3px solid transparent;
border-top-color: #FFF; border-top-color: #FFF;
-moz-animation: spin 1.5s linear infinite; -moz-animation: spin 1.5s linear infinite;
-o-animation: spin 1.5s linear infinite; -o-animation: spin 1.5s linear infinite;
-ms-animation: spin 1.5s linear infinite; -ms-animation: spin 1.5s linear infinite;
-webkit-animation: spin 1.5s linear infinite; -webkit-animation: spin 1.5s linear infinite;
animation: spin 1.5s linear infinite; animation: spin 1.5s linear infinite;
} }
@-webkit-keyframes spin { @-webkit-keyframes spin {
0% { 0% {
-webkit-transform: rotate(0deg); -webkit-transform: rotate(0deg);
-ms-transform: rotate(0deg); -ms-transform: rotate(0deg);
transform: rotate(0deg); transform: rotate(0deg);
} }
100% { 100% {
-webkit-transform: rotate(360deg); -webkit-transform: rotate(360deg);
-ms-transform: rotate(360deg); -ms-transform: rotate(360deg);
transform: rotate(360deg); transform: rotate(360deg);
} }
} }
@keyframes spin { @keyframes spin {
0% { 0% {
-webkit-transform: rotate(0deg); -webkit-transform: rotate(0deg);
-ms-transform: rotate(0deg); -ms-transform: rotate(0deg);
transform: rotate(0deg); transform: rotate(0deg);
} }
100% { 100% {
-webkit-transform: rotate(360deg); -webkit-transform: rotate(360deg);
-ms-transform: rotate(360deg); -ms-transform: rotate(360deg);
transform: rotate(360deg); transform: rotate(360deg);
} }
} }
#loader-wrapper .loader-section { #loader-wrapper .loader-section {
position: fixed; position: fixed;
top: 0; top: 0;
width: 51%; width: 51%;
height: 100%; height: 100%;
background: #7171C6; background: #acacff;
z-index: 1000; /*background: #c80000;*/
-webkit-transform: translateX(0); z-index: 1000;
-ms-transform: translateX(0); -webkit-transform: translateX(0);
transform: translateX(0); -ms-transform: translateX(0);
} transform: translateX(0);
}
#loader-wrapper .loader-section.section-left {
left: 0; #loader-wrapper .loader-section.section-left {
} left: 0;
}
#loader-wrapper .loader-section.section-right {
right: 0; #loader-wrapper .loader-section.section-right {
} right: 0;
}
.loaded #loader-wrapper .loader-section.section-left {
-webkit-transform: translateX(-100%); .loaded #loader-wrapper .loader-section.section-left {
-ms-transform: translateX(-100%); -webkit-transform: translateX(-100%);
transform: translateX(-100%); -ms-transform: translateX(-100%);
-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000); transform: translateX(-100%);
transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000); -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
} transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}
.loaded #loader-wrapper .loader-section.section-right {
-webkit-transform: translateX(100%); .loaded #loader-wrapper .loader-section.section-right {
-ms-transform: translateX(100%); -webkit-transform: translateX(100%);
transform: translateX(100%); -ms-transform: translateX(100%);
-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000); transform: translateX(100%);
transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000); -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
} transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}
.loaded #loader {
opacity: 0; .loaded #loader {
-webkit-transition: all 0.3s ease-out; opacity: 0;
transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out;
} transition: all 0.3s ease-out;
}
.loaded #loader-wrapper {
visibility: hidden; .loaded #loader-wrapper {
-webkit-transform: translateY(-100%); visibility: hidden;
-ms-transform: translateY(-100%); -webkit-transform: translateY(-100%);
transform: translateY(-100%); -ms-transform: translateY(-100%);
-webkit-transition: all 0.3s 1s ease-out; transform: translateY(-100%);
transition: all 0.3s 1s ease-out; -webkit-transition: all 0.3s 1s ease-out;
} transition: all 0.3s 1s ease-out;
}
.no-js #loader-wrapper {
display: none; .no-js #loader-wrapper {
} display: none;
}
.no-js h1 {
color: #222222; .no-js h1 {
} color: #222222;
}
#loader-wrapper .load_title {
font-family: 'Open Sans'; #loader-wrapper .load_title {
color: #FFF; font-family: 'Open Sans';
font-size: 19px; color: #FFF;
width: 100%; font-size: 19px;
text-align: center; width: 100%;
z-index: 9999999999999; text-align: center;
position: absolute; z-index: 9999999999999;
top: 60%; position: absolute;
opacity: 1; top: 60%;
line-height: 30px; opacity: 1;
} line-height: 30px;
}
#loader-wrapper .load_title span {
font-weight: normal; #loader-wrapper .load_title span {
font-style: italic; font-weight: normal;
font-size: 13px; font-style: italic;
color: #FFF; font-size: 13px;
opacity: 0.5; color: #FFF;
} opacity: 0.5;
</style> }
</head> </style>
<body> </head>
<div id="app"> <body>
<div id="loader-wrapper"> <div id="app">
<div id="loader"></div> <div id="loader-wrapper">
<div class="loader-section section-left"></div> <div id="loader"></div>
<div class="loader-section section-right"></div> <div class="loader-section section-left"></div>
<div class="load_title">正在加载系统资源，请耐心等待</div> <div class="loader-section section-right"></div>
</div> <div class="load_title">正在加载投选活动，请耐心等待</div>
</div> </div>
</body> </div>
</html> </body>
</html>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment