更新基础颜色,增加青色与紫色
parent
0f772ee913
commit
6ab1adb31c
File diff suppressed because one or more lines are too long
|
@ -16,13 +16,19 @@
|
||||||
&.large {min-width:150px;height:50px;padding:0 13px;line-height:50px;font-size:18px;}
|
&.large {min-width:150px;height:50px;padding:0 13px;line-height:50px;font-size:18px;}
|
||||||
&.radius-3 {border-radius:3px;}
|
&.radius-3 {border-radius:3px;}
|
||||||
&.radius-5 {border-radius:5px;}
|
&.radius-5 {border-radius:5px;}
|
||||||
|
|
||||||
|
&.teal {border:0;background:nth($ct, 1);color:#fff;}
|
||||||
|
&.teal:hover {background:nth($ct, 2);}
|
||||||
|
&.teal:active {background:nth($ct, 3);}
|
||||||
&.green {border:0;background:nth($cg, 1);color:#fff;}
|
&.green {border:0;background:nth($cg, 1);color:#fff;}
|
||||||
&.green:hover {background:nth($cg, 2);}
|
&.green:hover {background:nth($cg, 2);}
|
||||||
&.green:active {background:nth($cg, 3);}
|
&.green:active {background:nth($cg, 3);}
|
||||||
&.blue {border:0;background:nth($cb, 1);color:#fff;}
|
&.blue {border:0;background:nth($cb, 1);color:#fff;}
|
||||||
&.blue:hover {background:nth($cb, 2);}
|
&.blue:hover {background:nth($cb, 2);}
|
||||||
&.blue:active {background:nth($cb, 3);}
|
&.blue:active {background:nth($cb, 3);}
|
||||||
|
&.purple {border:0;background:nth($cpp, 1);color:#fff;}
|
||||||
|
&.purple:hover {background:nth($cpp, 2);}
|
||||||
|
&.purple:active {background:nth($cpp, 3);}
|
||||||
&.red {border:0;background:nth($cr, 1);color:#fff;}
|
&.red {border:0;background:nth($cr, 1);color:#fff;}
|
||||||
&.red:hover {background:nth($cr, 2);}
|
&.red:hover {background:nth($cr, 2);}
|
||||||
&.red:active {background:nth($cr, 3);}
|
&.red:active {background:nth($cr, 3);}
|
||||||
|
@ -81,7 +87,7 @@
|
||||||
&.radius-3 {border-radius:3px;}
|
&.radius-3 {border-radius:3px;}
|
||||||
&.radius-5 {border-radius:5px;}
|
&.radius-5 {border-radius:5px;}
|
||||||
|
|
||||||
&:focus,&:hover {border-color:nth($cg, 1);color:nth($cg, 1);}
|
&:focus,&:hover {border-color:nth($ct, 1);}
|
||||||
&.alert {border-color:nth($cr, 1);color:nth($cr, 1);
|
&.alert {border-color:nth($cr, 1);color:nth($cr, 1);
|
||||||
input {color:nth($cr, 1);}
|
input {color:nth($cr, 1);}
|
||||||
}
|
}
|
||||||
|
@ -109,7 +115,7 @@
|
||||||
&.radius-3 {border-radius:3px;}
|
&.radius-3 {border-radius:3px;}
|
||||||
&.radius-5 {border-radius:5px;}
|
&.radius-5 {border-radius:5px;}
|
||||||
|
|
||||||
&:focus {border-color:nth($cg, 1);}
|
&:focus {border-color:nth($ct, 1);}
|
||||||
&.alert {border-color:nth($cr, 1);color:nth($cr, 1)}
|
&.alert {border-color:nth($cr, 1);color:nth($cr, 1)}
|
||||||
&.disabled {border-color:transparent;background:nth($cp, 1);color:nth($cp, 3)}
|
&.disabled {border-color:transparent;background:nth($cp, 1);color:nth($cp, 3)}
|
||||||
}
|
}
|
||||||
|
@ -133,9 +139,15 @@
|
||||||
&.green >input:checked {background:nth($cg, 2);
|
&.green >input:checked {background:nth($cg, 2);
|
||||||
&::after {background:nth($cg, 3);}
|
&::after {background:nth($cg, 3);}
|
||||||
}
|
}
|
||||||
|
&.teal >input:checked {background:nth($cg, 2);
|
||||||
|
&::after {background:nth($ct, 3);}
|
||||||
|
}
|
||||||
&.blue >input:checked {background:nth($cb, 2);
|
&.blue >input:checked {background:nth($cb, 2);
|
||||||
&::after {background:nth($cb, 3);}
|
&::after {background:nth($cb, 3);}
|
||||||
}
|
}
|
||||||
|
&.purple >input:checked {background:nth($cb, 2);
|
||||||
|
&::after {background:nth($cpp, 3);}
|
||||||
|
}
|
||||||
&.red >input:checked {background:nth($cr, 2);
|
&.red >input:checked {background:nth($cr, 2);
|
||||||
&::after {background:nth($cr, 3);}
|
&::after {background:nth($cr, 3);}
|
||||||
}
|
}
|
||||||
|
@ -154,6 +166,8 @@
|
||||||
&:disabled {border-color:nth($cp, 3);color:nth($cp, 3);}
|
&:disabled {border-color:nth($cp, 3);color:nth($cp, 3);}
|
||||||
}
|
}
|
||||||
&.green >input {color:nth($cg, 1)!important;border-color:nth($cg, 1)}
|
&.green >input {color:nth($cg, 1)!important;border-color:nth($cg, 1)}
|
||||||
|
&.teal >input {color:nth($ct, 1)!important;border-color:nth($ct, 1)}
|
||||||
|
&.purple >input {color:nth($cpp, 1)!important;border-color:nth($cpp, 1)}
|
||||||
&.blue >input {color:nth($cb, 1)!important;border-color:nth($cb, 1)}
|
&.blue >input {color:nth($cb, 1)!important;border-color:nth($cb, 1)}
|
||||||
&.red >input {color:nth($cr, 1)!important;border-color:nth($cr, 1)}
|
&.red >input {color:nth($cr, 1)!important;border-color:nth($cr, 1)}
|
||||||
&.orange >input {color:nth($co, 1)!important;border-color:nth($co, 1)}
|
&.orange >input {color:nth($co, 1)!important;border-color:nth($co, 1)}
|
||||||
|
@ -169,6 +183,8 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
&.green {border-color:nth($cg, 1);background:nth($cg, 1);color:#fff;}
|
&.green {border-color:nth($cg, 1);background:nth($cg, 1);color:#fff;}
|
||||||
|
&.teal {border-color:nth($ct, 1);background:nth($ct, 1);color:#fff;}
|
||||||
|
&.purple {border-color:nth($cpp, 1);background:nth($cpp, 1);color:#fff;}
|
||||||
&.blue {border-color:nth($cb, 1);background:nth($cb, 1);color:#fff;}
|
&.blue {border-color:nth($cb, 1);background:nth($cb, 1);color:#fff;}
|
||||||
&.red {border-color:nth($cr, 1);background:nth($cr, 1);color:#fff;}
|
&.red {border-color:nth($cr, 1);background:nth($cr, 1);color:#fff;}
|
||||||
&.orange {border-color:nth($co, 1);background:nth($co, 1);color:#fff;}
|
&.orange {border-color:nth($co, 1);background:nth($co, 1);color:#fff;}
|
||||||
|
@ -190,7 +206,7 @@
|
||||||
p {margin:0!important;}
|
p {margin:0!important;}
|
||||||
&::before {position:absolute;left:8px;top:0;font:30px/1.5 "ui font";color:nth($cr, 1);content:"\e6f6";}
|
&::before {position:absolute;left:8px;top:0;font:30px/1.5 "ui font";color:nth($cr, 1);content:"\e6f6";}
|
||||||
}
|
}
|
||||||
.do-ui-mark {border-color:nth($cg, 2);color:nth($cg, 3);background:#edfbf8;
|
.do-ui-mark {border-color:nth($ct, 2);color:nth($ct, 3);background:#edfbf8;
|
||||||
|
|
||||||
&::before {color:nth($cg, 3);content:"\e657";}
|
&::before {color:nth($ct, 3);content:"\e657";}
|
||||||
}
|
}
|
12
css/var.scss
12
css/var.scss
|
@ -1,9 +1,11 @@
|
||||||
$cg: #1abc9c #48c9b0 #16a085;
|
$ct: #1abc9c #48c9b0 #16a085;
|
||||||
$cb: #3498db #5dade2 #2c81ba;
|
$cg: #4caf50 #81c784 #388e3c;
|
||||||
$cr: #e74c3c #ec7063 #c54133;
|
$cpp: #651fff #7c4dff #6200ea;
|
||||||
$co: #f39c12 #fbbb56 #e67e22;
|
$cb: #2196f3 #64b5f6 #1976d2;
|
||||||
|
$cr: #ff5722 #ff7043 #e64a19;
|
||||||
|
$co: #ff9800 #ffa726 #f57c00;
|
||||||
$cp: #e7e8eb #ecf0f1 #bdc3c7;
|
$cp: #e7e8eb #ecf0f1 #bdc3c7;
|
||||||
$cgr: #34495e #5d6d7e #2c3e50;
|
$cgr: #546e7a #607d8b #37474f;
|
||||||
|
|
||||||
@mixin ts($c: all, $t: .1s, $m: ease-in-out){
|
@mixin ts($c: all, $t: .1s, $m: ease-in-out){
|
||||||
transition:$c $t $m;
|
transition:$c $t $m;
|
||||||
|
|
|
@ -1 +1 @@
|
||||||
.do-datepicker{position:relative;z-index:65534;width:100%;height:100%}.do-datepicker a{text-decoration:none}.do-datepicker .date-input{display:block;width:100%;height:100%;padding:0 5px;line-height:18px;border:1px solid #e7e8eb;transition:all .1s ease-in-out}.do-datepicker .date-input:focus{border-color:#1abc9c}.do-datepicker .calendar-box{position:absolute;left:0;top:100%;width:267px;height:auto;min-height:60px;padding:10px;line-height:35px;border:1px solid #ddd;background:#fff;font-size:14px;color:#34495e;text-align:center;box-shadow:0 1px 5px rgba(0,0,0,0.1)}.do-datepicker .calendar-box dt.title{width:100%;height:35px;background:#e7e8eb}.do-datepicker .calendar-box dd.contrl{position:relative;width:90%;height:35px;margin:0 5%}.do-datepicker .calendar-box dd.contrl a{position:absolute;left:0;top:0;width:35px;height:35px;color:#34495e;font-weight:bold}.do-datepicker .calendar-box dd.contrl a:hover{color:#1abc9c}.do-datepicker .calendar-box dd.contrl a.prev-month{left:35px}.do-datepicker .calendar-box dd.contrl a.next-month{left:auto;right:35px}.do-datepicker .calendar-box dd.contrl a.next-year{left:auto;right:0}.do-datepicker .calendar-box dd.calendar{width:100%;height:auto}.do-datepicker .calendar-box dd.calendar .week{width:100%;height:35px;margin-bottom:5px;border-bottom:1px solid #eee}.do-datepicker .calendar-box dd.calendar span.td{float:left;width:35px}.do-datepicker .calendar-box dd.calendar .list span.td{height:30px;line-height:30px;cursor:pointer;transition:all .1s ease-in-out}.do-datepicker .calendar-box dd.calendar .list span.td:hover{background:#e7e8eb}.do-datepicker .calendar-box dd.calendar .list span.td.weeken{color:#e74c3c}.do-datepicker .calendar-box dd.calendar .list span.td.selected{background:#48c9b0;color:#fff}.do-datepicker .calendar-box dd.calendar .list span.td.disabled{color:#bdc3c7;cursor:default}.do-datepicker .calendar-box dd.calendar .list span.td.disabled:hover{background:none}.do-datepicker .calendar-box dd.time{position:relative;width:100%;height:41px;padding:5px 0;margin-top:5px;line-height:30px;border-top:1px solid #eee}.do-datepicker .calendar-box dd.time label{float:left;width:60px;height:30px}.do-datepicker .calendar-box dd.time label input{width:30px;height:30px;border:1px solid #e7e8eb;text-align:center}.do-datepicker .calendar-box dd.time .now{float:right;width:50px;height:30px;border-radius:3px;background:#1abc9c;color:#fff;text-align:center}.do-datepicker .calendar-box dd.time .now:hover{background:#48c9b0}.do-datepicker .calendar-box dd.time .now:active{background:#16a085}.do-datepicker .calendar-box dd.tips{position:absolute;z-index:65535;left:25%;top:40%;width:50%;height:30px;line-height:30px;background:rgba(0,0,0,0.7);color:#fff;font-size:12px;text-align:center}
|
.do-datepicker{position:relative;z-index:65534;width:100%;height:100%}.do-datepicker a{text-decoration:none}.do-datepicker .date-input{display:block;width:100%;height:100%;padding:0 5px;line-height:18px;border:1px solid #e7e8eb;transition:all .1s ease-in-out}.do-datepicker .date-input:focus{border-color:#1abc9c}.do-datepicker .calendar-box{position:absolute;left:0;top:100%;width:267px;height:auto;min-height:60px;padding:10px;line-height:35px;border:1px solid #ddd;background:#fff;font-size:14px;color:#546e7a;text-align:center;box-shadow:0 1px 5px rgba(0,0,0,0.1)}.do-datepicker .calendar-box dt.title{width:100%;height:35px;background:#e7e8eb}.do-datepicker .calendar-box dd.contrl{position:relative;width:90%;height:35px;margin:0 5%}.do-datepicker .calendar-box dd.contrl a{position:absolute;left:0;top:0;width:35px;height:35px;color:#546e7a;font-weight:bold}.do-datepicker .calendar-box dd.contrl a:hover{color:#1abc9c}.do-datepicker .calendar-box dd.contrl a.prev-month{left:35px}.do-datepicker .calendar-box dd.contrl a.next-month{left:auto;right:35px}.do-datepicker .calendar-box dd.contrl a.next-year{left:auto;right:0}.do-datepicker .calendar-box dd.calendar{width:100%;height:auto}.do-datepicker .calendar-box dd.calendar .week{width:100%;height:35px;margin-bottom:5px;border-bottom:1px solid #eee}.do-datepicker .calendar-box dd.calendar span.td{float:left;width:35px}.do-datepicker .calendar-box dd.calendar .list span.td{height:30px;line-height:30px;cursor:pointer;transition:all .1s ease-in-out}.do-datepicker .calendar-box dd.calendar .list span.td:hover{background:#e7e8eb}.do-datepicker .calendar-box dd.calendar .list span.td.weeken{color:#ff5722}.do-datepicker .calendar-box dd.calendar .list span.td.selected{background:#48c9b0;color:#fff}.do-datepicker .calendar-box dd.calendar .list span.td.disabled{color:#bdc3c7;cursor:default}.do-datepicker .calendar-box dd.calendar .list span.td.disabled:hover{background:none}.do-datepicker .calendar-box dd.time{position:relative;width:100%;height:41px;padding:5px 0;margin-top:5px;line-height:30px;border-top:1px solid #eee}.do-datepicker .calendar-box dd.time label{float:left;width:60px;height:30px}.do-datepicker .calendar-box dd.time label input{width:30px;height:30px;border:1px solid #e7e8eb;text-align:center}.do-datepicker .calendar-box dd.time .now{float:right;width:50px;height:30px;border-radius:3px;background:#1abc9c;color:#fff;text-align:center}.do-datepicker .calendar-box dd.time .now:hover{background:#48c9b0}.do-datepicker .calendar-box dd.time .now:active{background:#16a085}.do-datepicker .calendar-box dd.tips{position:absolute;z-index:65535;left:25%;top:40%;width:50%;height:30px;line-height:30px;background:rgba(0,0,0,0.7);color:#fff;font-size:12px;text-align:center}
|
||||||
|
|
|
@ -11,7 +11,7 @@
|
||||||
a {text-decoration:none;}
|
a {text-decoration:none;}
|
||||||
.date-input {display:block;width:100%;height:100%;padding:0 5px;line-height:18px;border:1px solid nth($cp, 1);@include ts();
|
.date-input {display:block;width:100%;height:100%;padding:0 5px;line-height:18px;border:1px solid nth($cp, 1);@include ts();
|
||||||
|
|
||||||
&:focus {border-color:nth($cg, 1)}
|
&:focus {border-color:nth($ct, 1)}
|
||||||
}
|
}
|
||||||
|
|
||||||
.calendar-box {position:absolute;left:0;top:100%;width:267px;height:auto;min-height:60px;padding:10px;line-height:35px;border:1px solid #ddd;background:#fff;font-size:14px;color:nth($cgr, 1);text-align:center;box-shadow:0 1px 5px rgba(0,0,0,.1);
|
.calendar-box {position:absolute;left:0;top:100%;width:267px;height:auto;min-height:60px;padding:10px;line-height:35px;border:1px solid #ddd;background:#fff;font-size:14px;color:nth($cgr, 1);text-align:center;box-shadow:0 1px 5px rgba(0,0,0,.1);
|
||||||
|
@ -20,7 +20,7 @@
|
||||||
dd.contrl {position:relative;width:90%;height:35px;margin:0 5%;
|
dd.contrl {position:relative;width:90%;height:35px;margin:0 5%;
|
||||||
|
|
||||||
a {position:absolute;left:0;top:0;width:35px;height:35px;color:nth($cgr, 1);font-weight:bold;}
|
a {position:absolute;left:0;top:0;width:35px;height:35px;color:nth($cgr, 1);font-weight:bold;}
|
||||||
a:hover {color:nth($cg, 1)}
|
a:hover {color:nth($ct, 1)}
|
||||||
a.prev-month {left:35px;}
|
a.prev-month {left:35px;}
|
||||||
a.next-month {left:auto;right:35px;}
|
a.next-month {left:auto;right:35px;}
|
||||||
a.next-year {left:auto;right:0;}
|
a.next-year {left:auto;right:0;}
|
||||||
|
@ -34,7 +34,7 @@
|
||||||
|
|
||||||
&:hover {background:nth($cp, 1);}
|
&:hover {background:nth($cp, 1);}
|
||||||
&.weeken {color:nth($cr, 1)}
|
&.weeken {color:nth($cr, 1)}
|
||||||
&.selected {background:nth($cg, 2);color:#fff}
|
&.selected {background:nth($ct, 2);color:#fff}
|
||||||
&.disabled {color:nth($cp, 3);cursor:default;}
|
&.disabled {color:nth($cp, 3);cursor:default;}
|
||||||
&.disabled:hover {background:none;}
|
&.disabled:hover {background:none;}
|
||||||
}
|
}
|
||||||
|
@ -44,10 +44,10 @@
|
||||||
label {float:left;width:60px;height:30px;
|
label {float:left;width:60px;height:30px;
|
||||||
input {width:30px;height:30px;border:1px solid nth($cp, 1);text-align:center;}
|
input {width:30px;height:30px;border:1px solid nth($cp, 1);text-align:center;}
|
||||||
}
|
}
|
||||||
.now {float:right;width:50px;height:30px;border-radius:3px;background:nth($cg, 1);color:#fff;text-align:center;
|
.now {float:right;width:50px;height:30px;border-radius:3px;background:nth($ct, 1);color:#fff;text-align:center;
|
||||||
|
|
||||||
&:hover {background:nth($cg, 2);}
|
&:hover {background:nth($ct, 2);}
|
||||||
&:active {background:nth($cg, 3);}
|
&:active {background:nth($ct, 3);}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
dd.tips {position:absolute;z-index:65535;left:25%;top:40%;width:50%;height:30px;line-height:30px;background:rgba(0,0,0,.7);color:#fff;font-size:12px;text-align:center;}
|
dd.tips {position:absolute;z-index:65535;left:25%;top:40%;width:50%;height:30px;line-height:30px;background:rgba(0,0,0,.7);color:#fff;font-size:12px;text-align:center;}
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -17,15 +17,15 @@
|
||||||
&.skin-def {color:#666;font-size:14px;box-shadow:0 0 10px rgba(0,0,0,.3);
|
&.skin-def {color:#666;font-size:14px;box-shadow:0 0 10px rgba(0,0,0,.3);
|
||||||
|
|
||||||
.icon-0::before {content:"\e62e";color:nth($cr, 1);} // question
|
.icon-0::before {content:"\e62e";color:nth($cr, 1);} // question
|
||||||
.icon-1::before {content:"\e610";color:nth($cg, 1);} // get
|
.icon-1::before {content:"\e610";color:nth($ct, 1);} // get
|
||||||
.icon-2::before {content:"\e6f8";color:nth($cb, 1);} // happy
|
.icon-2::before {content:"\e6f8";color:nth($cb, 1);} // happy
|
||||||
.icon-3::before {content:"\e6fd";color:nth($co, 1);} // sad
|
.icon-3::before {content:"\e6fd";color:nth($co, 1);} // sad
|
||||||
.icon-4::before {content:"\e6f6";color:nth($co, 1);} // warn
|
.icon-4::before {content:"\e6f6";color:nth($co, 1);} // warn
|
||||||
.icon-5::before {content:"\e630";color:nth($cg, 1);} // face
|
.icon-5::before {content:"\e630";color:nth($ct, 1);} // face
|
||||||
.icon-6::before {content:"\e636";color:nth($cgr, 1);} // time
|
.icon-6::before {content:"\e636";color:nth($cgr, 1);} // time
|
||||||
.icon-7::before {content:"\e623";color:nth($co, 1);} // star
|
.icon-7::before {content:"\e623";color:nth($co, 1);} // star
|
||||||
.icon-8::before {content:"\e604";color:nth($cr, 1);} // mute
|
.icon-8::before {content:"\e604";color:nth($cr, 1);} // mute
|
||||||
.icon-9::before {content:"\e605";color:nth($cg, 1);} // unmute
|
.icon-9::before {content:"\e605";color:nth($ct, 1);} // unmute
|
||||||
|
|
||||||
|
|
||||||
/* 弹层标题栏 */
|
/* 弹层标题栏 */
|
||||||
|
@ -34,7 +34,7 @@
|
||||||
.action-min,
|
.action-min,
|
||||||
.action-close {position:absolute;display:block;top:12px;width:20px;height:20px;line-height:20px;font-size:14px;text-align:center;cursor:pointer;color:nth($cgr, 2);
|
.action-close {position:absolute;display:block;top:12px;width:20px;height:20px;line-height:20px;font-size:14px;text-align:center;cursor:pointer;color:nth($cgr, 2);
|
||||||
|
|
||||||
&:hover {color:nth($cg, 1);}
|
&:hover {color:nth($ct, 1);}
|
||||||
}
|
}
|
||||||
.action-min {right:40px;
|
.action-min {right:40px;
|
||||||
&::before {content:"\e634"}
|
&::before {content:"\e634"}
|
||||||
|
@ -52,7 +52,7 @@
|
||||||
.prompt-value {width: 230px;height: 30px;padding: 0 8px;border: 1px solid #ddd;border-radius: 3px;
|
.prompt-value {width: 230px;height: 30px;padding: 0 8px;border: 1px solid #ddd;border-radius: 3px;
|
||||||
|
|
||||||
&.alert {border-color:nth($cr, 1)}
|
&.alert {border-color:nth($cr, 1)}
|
||||||
&:focus {border-color:nth($cg, 1)}
|
&:focus {border-color:nth($ct, 1)}
|
||||||
}
|
}
|
||||||
.msg-box {line-height:30px;}
|
.msg-box {line-height:30px;}
|
||||||
}
|
}
|
||||||
|
@ -124,7 +124,7 @@
|
||||||
|
|
||||||
.dot-box{width:100%;height:100%;
|
.dot-box{width:100%;height:100%;
|
||||||
|
|
||||||
i {float:left;display:block;width:10px;height:100%;margin:0 5px;background:nth($cg, 3);-webkit-animation: bounce 1s infinite ease-in-out;-moz-animation: bounce 1s infinite ease-in-out;animation: bounce 1s infinite ease-in-out;-webkit-transform:scaleY(.6);-moz-transform:scaleY(.6);transform:scaleY(.6);
|
i {float:left;display:block;width:10px;height:100%;margin:0 5px;background:nth($ct, 3);-webkit-animation: bounce 1s infinite ease-in-out;-moz-animation: bounce 1s infinite ease-in-out;animation: bounce 1s infinite ease-in-out;-webkit-transform:scaleY(.6);-moz-transform:scaleY(.6);transform:scaleY(.6);
|
||||||
|
|
||||||
&:nth-child(2) {-webkit-animation-delay:.1s;-moz-animation-delay:.1s;animation-delay:.1s;}
|
&:nth-child(2) {-webkit-animation-delay:.1s;-moz-animation-delay:.1s;animation-delay:.1s;}
|
||||||
&:nth-child(3) {-webkit-animation-delay:.2s;-moz-animation-delay:.2s;animation-delay:.2s;}
|
&:nth-child(3) {-webkit-animation-delay:.2s;-moz-animation-delay:.2s;animation-delay:.2s;}
|
||||||
|
@ -141,7 +141,7 @@
|
||||||
|
|
||||||
i {position:absolute;display:block;width:60px;height:60px;-webkit-animation: circle2 2s infinite ease-in-out;-moz-animation: circle2 2s infinite ease-in-out;animation: circle2 2s infinite ease-in-out;-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);transform: rotate(45deg);
|
i {position:absolute;display:block;width:60px;height:60px;-webkit-animation: circle2 2s infinite ease-in-out;-moz-animation: circle2 2s infinite ease-in-out;animation: circle2 2s infinite ease-in-out;-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);transform: rotate(45deg);
|
||||||
|
|
||||||
&::before {display:block;width:8px;height:8px;background:nth($cg, 3);border-radius:50%;content:""}
|
&::before {display:block;width:8px;height:8px;background:nth($ct, 3);border-radius:50%;content:""}
|
||||||
|
|
||||||
&:nth-child(2) {-webkit-animation-delay:.1s;-moz-animation-delay:.1s;animation-delay:.1s;}
|
&:nth-child(2) {-webkit-animation-delay:.1s;-moz-animation-delay:.1s;animation-delay:.1s;}
|
||||||
&:nth-child(3) {-webkit-animation-delay:.2s;-moz-animation-delay:.2s;animation-delay:.2s;}
|
&:nth-child(3) {-webkit-animation-delay:.2s;-moz-animation-delay:.2s;animation-delay:.2s;}
|
||||||
|
@ -156,7 +156,7 @@
|
||||||
|
|
||||||
.dot-box{width:90%;height:90%;margin:5%;
|
.dot-box{width:90%;height:90%;margin:5%;
|
||||||
|
|
||||||
i {float:left;display:block;width:30px;height:30px;background:nth($cg, 3);-webkit-animation: grid 1.5s infinite linear;-moz-animation: grid 1.5s infinite linear;animation: grid 1.5s infinite linear;
|
i {float:left;display:block;width:30px;height:30px;background:nth($ct, 3);-webkit-animation: grid 1.5s infinite linear;-moz-animation: grid 1.5s infinite linear;animation: grid 1.5s infinite linear;
|
||||||
|
|
||||||
&:nth-child(4),
|
&:nth-child(4),
|
||||||
&:nth-child(8) {-webkit-animation-delay:.2s;-moz-animation-delay:.2s;animation-delay:.2s;}
|
&:nth-child(8) {-webkit-animation-delay:.2s;-moz-animation-delay:.2s;animation-delay:.2s;}
|
||||||
|
|
|
@ -1 +1 @@
|
||||||
.do-pages{height:auto;text-align:center;font-size:13px}.do-pages a{display:inline-block;width:auto;min-width:40px;height:40px;line-height:40px;color:#34495e;text-decoration:none;cursor:pointer}.do-pages a.curr,.do-pages a.disabled{cursor:default}.do-pages.skin-1{width:100%}.do-pages.skin-1 a.normal,.do-pages.skin-1 a.disabled,.do-pages.skin-1 a.curr{padding:0 10px;margin:0 3px}.do-pages.skin-1 a.curr{font-weight:bold;font-size:15px}.do-pages.skin-1 a.disabled{min-width:0;padding:0}.do-pages.skin-1 .input-box,.do-pages.skin-1 .input-box span,.do-pages.skin-1 .input-box input{display:inline-block}.do-pages.skin-1 .input-box input{width:25px;height:20px;padding:0 3px;background:#fff;border:1px solid #ddd}.do-pages.skin-1 .input-box a.normal{height:30px;line-height:30px}.do-pages.skin-2{float:right;width:auto}.do-pages.skin-2 a.normal,.do-pages.skin-2 a.disabled,.do-pages.skin-2 a.curr{float:left;margin:0;padding:0 5px;color:#fff}.do-pages.skin-2 a.disabled{display:none}.do-pages.skin-2 .input-box{display:none}.do-pages.plain a.normal{background:#e7e8eb}.do-pages.plain a.normal:hover{background:#ecf0f1}.do-pages.skin-2.plain a.curr,.do-pages.plain a.normal:active{background:#bdc3c7}.do-pages.grey a.normal{background:#34495e;color:#fff}.do-pages.grey a.normal:hover{background:#5d6d7e}.do-pages.skin-2.grey a.curr,.do-pages.grey a.normal:active{background:#2c3e50}.do-pages.red a.normal{background:#e74c3c;color:#fff}.do-pages.red a.normal:hover{background:#ec7063}.do-pages.skin-2.red a.curr,.do-pages.red a.normal:active{background:#c54133}.do-pages.orange a.normal{background:#f39c12;color:#fff}.do-pages.orange a.normal:hover{background:#fbbb56}.do-pages.skin-2.orange a.curr,.do-pages.orange a.normal:active{background:#e67e22}.do-pages.green a.normal{background:#1abc9c;color:#fff}.do-pages.green a.normal:hover{background:#48c9b0}.do-pages.skin-2.green a.curr,.do-pages.green a.normal:active{background:#16a085}.do-pages.blue a.normal{background:#3498db;color:#fff}.do-pages.blue a.normal:hover{background:#5dade2}.do-pages.skin-2.blue a.curr,.do-pages.blue a.normal:active{background:#2c81ba}
|
.do-pages{height:auto;text-align:center;font-size:13px}.do-pages a{display:inline-block;width:auto;min-width:40px;height:40px;line-height:40px;color:#546e7a;text-decoration:none;cursor:pointer}.do-pages a.curr,.do-pages a.disabled{cursor:default}.do-pages.skin-1{width:100%}.do-pages.skin-1 a.normal,.do-pages.skin-1 a.disabled,.do-pages.skin-1 a.curr{padding:0 10px;margin:0 3px}.do-pages.skin-1 a.curr{font-weight:bold;font-size:15px}.do-pages.skin-1 a.disabled{min-width:0;padding:0}.do-pages.skin-1 .input-box,.do-pages.skin-1 .input-box span,.do-pages.skin-1 .input-box input{display:inline-block}.do-pages.skin-1 .input-box input{width:25px;height:20px;padding:0 3px;background:#fff;border:1px solid #ddd}.do-pages.skin-1 .input-box a.normal{height:30px;line-height:30px}.do-pages.skin-2{float:right;width:auto}.do-pages.skin-2 a.normal,.do-pages.skin-2 a.disabled,.do-pages.skin-2 a.curr{float:left;margin:0;padding:0 5px;color:#fff}.do-pages.skin-2 a.disabled{display:none}.do-pages.skin-2 .input-box{display:none}.do-pages.plain a.normal{background:#e7e8eb}.do-pages.plain a.normal:hover{background:#ecf0f1}.do-pages.skin-2.plain a.curr,.do-pages.plain a.normal:active{background:#bdc3c7}.do-pages.grey a.normal{background:#546e7a;color:#fff}.do-pages.grey a.normal:hover{background:#607d8b}.do-pages.skin-2.grey a.curr,.do-pages.grey a.normal:active{background:#37474f}.do-pages.red a.normal{background:#ff5722;color:#fff}.do-pages.red a.normal:hover{background:#ff7043}.do-pages.skin-2.red a.curr,.do-pages.red a.normal:active{background:#e64a19}.do-pages.orange a.normal{background:#ff9800;color:#fff}.do-pages.orange a.normal:hover{background:#ffa726}.do-pages.skin-2.orange a.curr,.do-pages.orange a.normal:active{background:#f57c00}.do-pages.green a.normal{background:#4caf50;color:#fff}.do-pages.green a.normal:hover{background:#81c784}.do-pages.skin-2.green a.curr,.do-pages.green a.normal:active{background:#388e3c}.do-pages.teal a.normal{background:#1abc9c;color:#fff}.do-pages.teal a.normal:hover{background:#48c9b0}.do-pages.skin-2.teal a.curr,.do-pages.teal a.normal:active{background:#16a085}.do-pages.blue a.normal{background:#2196f3;color:#fff}.do-pages.blue a.normal:hover{background:#64b5f6}.do-pages.skin-2.blue a.curr,.do-pages.blue a.normal:active{background:#1976d2}.do-pages.purple a.normal{background:#651fff;color:#fff}.do-pages.purple a.normal:hover{background:#7c4dff}.do-pages.skin-2.purple a.curr,.do-pages.purple a.normal:active{background:#6200ea}
|
||||||
|
|
|
@ -67,11 +67,21 @@
|
||||||
&.skin-2.green a.curr,
|
&.skin-2.green a.curr,
|
||||||
&.green a.normal:active {background:nth($cg, 3)}
|
&.green a.normal:active {background:nth($cg, 3)}
|
||||||
|
|
||||||
|
&.teal a.normal {background:nth($ct, 1);color: #fff;}
|
||||||
|
&.teal a.normal:hover {background:nth($ct, 2)}
|
||||||
|
&.skin-2.teal a.curr,
|
||||||
|
&.teal a.normal:active {background:nth($ct, 3)}
|
||||||
|
|
||||||
&.blue a.normal {background:nth($cb, 1);color: #fff;}
|
&.blue a.normal {background:nth($cb, 1);color: #fff;}
|
||||||
&.blue a.normal:hover {background:nth($cb, 2)}
|
&.blue a.normal:hover {background:nth($cb, 2)}
|
||||||
&.skin-2.blue a.curr,
|
&.skin-2.blue a.curr,
|
||||||
&.blue a.normal:active {background:nth($cb, 3)}
|
&.blue a.normal:active {background:nth($cb, 3)}
|
||||||
|
|
||||||
|
&.purple a.normal {background:nth($cpp, 1);color: #fff;}
|
||||||
|
&.purple a.normal:hover {background:nth($cpp, 2)}
|
||||||
|
&.skin-2.purple a.curr,
|
||||||
|
&.purple a.normal:active {background:nth($cpp, 3)}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
Reference in New Issue