245 lines
5.7 KiB
CSS
245 lines
5.7 KiB
CSS
html, body, #container, #loading {
|
|
width: 100%;
|
|
height: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
#loading {
|
|
top: 0;
|
|
z-index: 999;
|
|
position: fixed;
|
|
background-color: #FFF;
|
|
text-align: center;
|
|
background-image: url(ant-static://imgs/load.png);
|
|
background-repeat: no-repeat;
|
|
background-position: 50% 50%;
|
|
}
|
|
|
|
/*sidebar.bubble*/
|
|
.dhxsidebar_bubble {
|
|
width: auto !important;
|
|
padding: 0 5px;
|
|
background-color: #666 !important;
|
|
}
|
|
|
|
/*update*/
|
|
.ant-update {
|
|
font-family: sans-serif;
|
|
font-size: 14px;
|
|
}
|
|
.ant-update > .layui-layer-content {
|
|
padding: 10px 10px;
|
|
min-width: 300px;
|
|
}
|
|
.ant-update > .layui-layer-content > h3 {
|
|
margin: 0;
|
|
}
|
|
.ant-update > .layui-layer-content > ol {
|
|
color: #666;
|
|
}
|
|
.update-icon {
|
|
font-size: 100px;
|
|
text-align: center;
|
|
}
|
|
.dhxwins_vp_dhx_skyblue div.dhxwin_hdr div.update-winicon {
|
|
background-image: url("ant-static://imgs/cloud-download.svg");
|
|
}
|
|
|
|
/*update-loading*/
|
|
|
|
@-webkit-keyframes rotate_pacman_half_up {
|
|
0% {
|
|
-webkit-transform: rotate(270deg);
|
|
transform: rotate(270deg); }
|
|
|
|
50% {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg); }
|
|
|
|
100% {
|
|
-webkit-transform: rotate(270deg);
|
|
transform: rotate(270deg); } }
|
|
|
|
@keyframes rotate_pacman_half_up {
|
|
0% {
|
|
-webkit-transform: rotate(270deg);
|
|
transform: rotate(270deg); }
|
|
|
|
50% {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg); }
|
|
|
|
100% {
|
|
-webkit-transform: rotate(270deg);
|
|
transform: rotate(270deg); } }
|
|
|
|
@-webkit-keyframes rotate_pacman_half_down {
|
|
0% {
|
|
-webkit-transform: rotate(90deg);
|
|
transform: rotate(90deg); }
|
|
|
|
50% {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg); }
|
|
|
|
100% {
|
|
-webkit-transform: rotate(90deg);
|
|
transform: rotate(90deg); } }
|
|
|
|
@keyframes rotate_pacman_half_down {
|
|
0% {
|
|
-webkit-transform: rotate(90deg);
|
|
transform: rotate(90deg); }
|
|
|
|
50% {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg); }
|
|
|
|
100% {
|
|
-webkit-transform: rotate(90deg);
|
|
transform: rotate(90deg); } }
|
|
|
|
@-webkit-keyframes pacman-balls {
|
|
75% {
|
|
opacity: 0.7; }
|
|
|
|
100% {
|
|
-webkit-transform: translate(-100px, -6.25px);
|
|
transform: translate(-100px, -6.25px); } }
|
|
|
|
@keyframes pacman-balls {
|
|
75% {
|
|
opacity: 0.7; }
|
|
|
|
100% {
|
|
-webkit-transform: translate(-100px, -6.25px);
|
|
transform: translate(-100px, -6.25px); } }
|
|
|
|
.pacman {
|
|
position: relative;
|
|
margin-left: 30%;
|
|
}
|
|
.pacman > div:nth-child(2) {
|
|
-webkit-animation: pacman-balls 1s 0s infinite linear;
|
|
animation: pacman-balls 1s 0s infinite linear; }
|
|
.pacman > div:nth-child(3) {
|
|
-webkit-animation: pacman-balls 1s 0.33s infinite linear;
|
|
animation: pacman-balls 1s 0.33s infinite linear; }
|
|
.pacman > div:nth-child(4) {
|
|
-webkit-animation: pacman-balls 1s 0.66s infinite linear;
|
|
animation: pacman-balls 1s 0.66s infinite linear; }
|
|
.pacman > div:nth-child(5) {
|
|
-webkit-animation: pacman-balls 1s 0.99s infinite linear;
|
|
animation: pacman-balls 1s 0.99s infinite linear; }
|
|
.pacman > div:first-of-type {
|
|
width: 0px;
|
|
height: 0px;
|
|
border-right: 25px solid transparent;
|
|
border-top: 25px solid #666;
|
|
border-left: 25px solid #666;
|
|
border-bottom: 25px solid #666;
|
|
border-radius: 25px;
|
|
-webkit-animation: rotate_pacman_half_up 0.5s 0s infinite;
|
|
animation: rotate_pacman_half_up 0.5s 0s infinite; }
|
|
.pacman > div:nth-child(2) {
|
|
width: 0px;
|
|
height: 0px;
|
|
border-right: 25px solid transparent;
|
|
border-top: 25px solid #666;
|
|
border-left: 25px solid #666;
|
|
border-bottom: 25px solid #666;
|
|
border-radius: 25px;
|
|
-webkit-animation: rotate_pacman_half_down 0.5s 0s infinite;
|
|
animation: rotate_pacman_half_down 0.5s 0s infinite;
|
|
margin-top: -50px; }
|
|
.pacman > div:nth-child(3), .pacman > div:nth-child(4), .pacman > div:nth-child(5), .pacman > div:nth-child(6) {
|
|
background-color: #666;
|
|
width: 15px;
|
|
height: 15px;
|
|
border-radius: 100%;
|
|
margin: 2px;
|
|
width: 10px;
|
|
height: 10px;
|
|
position: absolute;
|
|
-webkit-transform: translate(0, -6.25px);
|
|
-ms-transform: translate(0, -6.25px);
|
|
transform: translate(0, -6.25px);
|
|
top: 25px;
|
|
left: 100px; }
|
|
|
|
|
|
/*关于*/
|
|
.about {
|
|
font-family: sans-serif;
|
|
-webkit-user-select: none;
|
|
}
|
|
.about > img {
|
|
width: 30%;
|
|
}
|
|
.about > img:hover {
|
|
-webkit-animation: tada 1s .2s ease both;
|
|
-moz-animation: tada 1s .2s ease both;
|
|
}
|
|
@-moz-keyframes tada{0%{-moz-transform:scale(1);}10%,20%{-moz-transform:scale(0.9) rotate(-3deg);}30%,50%,70%,90%{-moz-transform:scale(1.1) rotate(3deg);}40%,60%,80%{-moz-transform:scale(1.1) rotate(-3deg);}100%{-moz-transform:scale(1) rotate(0);}}
|
|
@-webkit-keyframes tada{0%{-webkit-transform:scale(1);}10%,20%{-webkit-transform:scale(0.9) rotate(-3deg);}30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg);}40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg);}100%{-webkit-transform:scale(1) rotate(0);}}
|
|
|
|
.about > hr {
|
|
width: 66%;
|
|
border-color: #ececec;
|
|
border-top: none;
|
|
}
|
|
|
|
.about > p {
|
|
color: #ececec;
|
|
}
|
|
.about > h2 > span {
|
|
font-size: 14px;
|
|
color: #9E9E9E;
|
|
}
|
|
.about a {
|
|
text-decoration: blink;
|
|
color: #795548;
|
|
transition: all .5s linear;
|
|
font-size: 14px;
|
|
}
|
|
.about a:hover {
|
|
color: #009688;
|
|
}
|
|
|
|
|
|
|
|
webview {
|
|
display:inline-flex;
|
|
width:100%;
|
|
height:100%;
|
|
}
|
|
webview.hide {
|
|
flex: 0 1;
|
|
width: 0px;
|
|
height: 0px;
|
|
}
|
|
|
|
|
|
/*滚动栏样式
|
|
|
|
::-webkit-scrollbar-track-piece {
|
|
background-color:#f5f5f5;
|
|
border-left:1px solid #d2d2d2;
|
|
}
|
|
::-webkit-scrollbar {
|
|
width:13px;
|
|
height:13px;
|
|
}
|
|
::-webkit-scrollbar-thumb {
|
|
background-color:#c2c2c2;
|
|
background-clip:padding-box;
|
|
border:1px solid #979797;
|
|
min-height:28px;
|
|
}
|
|
::-webkit-scrollbar-thumb:hover {
|
|
border:1px solid #636363;
|
|
background-color:#929292;
|
|
}
|
|
*/
|