This repository has been archived on 2023-08-30. You can view files and clone it, but cannot push or open issues/pull-requests.
bytedo
/
wcui
Archived
1
0
Fork 0
Code Issues Pull Requests Wiki Activity

调整基础色调

old
宇天 2018-07-15 19:43:34 +08:00
parent 95d0395d34
commit c31c7cebba
11 changed files with 211 additions and 203 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/css/var.scss
View File

@ -1,12 +1,12 @@
$ct: #19b491 #3fc2a7 #16967a; $ct: #3fc2a7 #19b491 #16967a;
$cg: #2ecc71 #58d68d #27ae60; $cg: #58d68d #2ecc71 #27ae60;
$cpp: #9b59b6 #ac61ce #8e44ad; $cpp: #ac61ce #9b59b6 #8e44ad;
$cb: #2d8dd6 #52a3de #2776b1; $cb: #52a3de #2d8dd6 #2776b1;
$cr: #eb3b48 #ff5061 #ce3742; $cr: #ff5061 #eb3b48 #ce3742;
$co: #f39c12 #ffb618 #e67e22; $co: #ffb618 #f39c12 #e67e22;
$cp: #e7e8eb #f3f5fb #bdc3c7; $cp: #f3f5fb #e8ebf4 #dae1e9;
$cgr: #8a9b9c #98acae #748182; $cgr: #98acae #8a9b9c #748182;
$cd: #526273 #62778d #34495e; $cd: #62778d #526273 #425064;
@mixin ts($c: all, $t: .2s, $m: ease-in-out){ @mixin ts($c: all, $t: .2s, $m: ease-in-out){
transition:$c $t $m; transition:$c $t $m;

32
src/js/datepicker/style.scss
View File

@ -7,31 +7,31 @@
*/ */
@import "var.scss"; @import "var.scss";
.do-datepicker { position:relative;display:inline-block;width:100%; height:100%;color:nth($cd, 1);font-size:14px; .do-datepicker { position:relative;display:inline-block;width:100%; height:100%;color:nth($cd, 2);font-size:14px;
&.mini {width:155px;height:30px;line-height:30px;} &.mini {width:155px;height:30px;line-height:30px;}
&.medium {width:175px;height:35px;line-height:35px;} &.medium {width:175px;height:35px;line-height:35px;}
&.large {width:195px;height:40px;line-height:40px;} &.large {width:195px;height:40px;line-height:40px;}
a { text-decoration:none;color:nth($cd, 1); a { text-decoration:none;color:nth($cd, 2);
&:hover {color:nth($cd, 2);} &:hover {color:nth($cd, 1);}
&:active {color:nth($cd, 3);} &:active {color:nth($cd, 3);}
} }
.date-input {position:relative; display:block; width:100%; height:100%; .date-input {position:relative; display:block; width:100%; height:100%;
.input { width:100%; height:100%;padding:0 5px; line-height:18px; border:1px solid nth($cp, 3);color:nth($cd, 1); @include ts(); .input { width:100%; height:100%;padding:0 5px; line-height:18px; border:1px solid nth($cp, 3);color:nth($cd, 2); @include ts();
&:focus { border-color:nth($ct, 1); } &:focus { border-color:nth($ct, 2); }
&[disabled] {background:#f7f8fb;cursor:not-allowed;} &[disabled] {background:#f7f8fb;cursor:not-allowed;}
} }
.icon {position:absolute;right:0;top:0;width:35px;text-align:center;font-size:25px;color:nth($cp, 3); .icon {position:absolute;right:0;top:0;width:35px;text-align:center;font-size:25px;color:nth($cp, 3);
} }
} }
.calendar-box { position:absolute; left:0; top:100%; z-index:65534; width:267px; height:auto; min-height:60px;padding:10px;line-height:35px; border:1px solid #ddd; background:#fff; font-size:14px; color:nth($cd, 1); text-align:center; box-shadow:0 1px 5px rgba(0, 0, 0, 0.1); .calendar-box { position:absolute; left:0; top:100%; z-index:65534; width:267px; height:auto; min-height:60px;padding:10px;line-height:35px; border:1px solid #ddd; background:#fff; font-size:14px; color:nth($cd, 2); text-align:center; box-shadow:0 1px 5px rgba(0, 0, 0, 0.1);
&::before {position:absolute;left:0;top:0;z-index:-1;width:100%;height:85px;background:nth($ct, 1);content:""} &::before {position:absolute;left:0;top:0;z-index:-1;width:100%;height:85px;background:nth($ct, 2);content:""}
dt.contrl {position:relative; width:100%; height:35px; margin:5px 0 0;border-radius:3px;color:#fff; dt.contrl {position:relative; width:100%; height:35px; margin:5px 0 0;border-radius:3px;color:#fff;
@ -57,7 +57,7 @@
.tr span.td { height:30px; line-height:30px;cursor:pointer; .tr span.td { height:30px; line-height:30px;cursor:pointer;
&::before {position:absolute;left:1px;top:0;z-index:-1;display:block;width:30px;height:30px;border-radius:50%;background:nth($cp, 1); content:"";opacity:0;transform: scale(0); transition:opacity .45s cubic-bezier(0.23, 1, 0.32, 1),transform .45s cubic-bezier(0.23, 1, 0.32, 1);} &::before {position:absolute;left:1px;top:0;z-index:-1;display:block;width:30px;height:30px;border-radius:50%;background:nth($cp, 2); content:"";opacity:0;transform: scale(0); transition:opacity .45s cubic-bezier(0.23, 1, 0.32, 1),transform .45s cubic-bezier(0.23, 1, 0.32, 1);}
&:hover,&.selected { &:hover,&.selected {
&::before {opacity:1;transform:scale(1);} &::before {opacity:1;transform:scale(1);}
@ -65,9 +65,9 @@
&.weeken {color:nth($ct, 3);} &.weeken {color:nth($ct, 3);}
&.selected {color:#fff; &.selected {color:#fff;
&::before {background:nth($ct, 2);} &::before {background:nth($ct, 1);}
} }
&.disabled { color:nth($cp, 1); cursor:default; &.disabled { color:nth($cp, 2); cursor:default;
&::before {display:none;} &::before {display:none;}
} }
@ -77,9 +77,9 @@
dd.time { position:relative; width:100%; height:41px; padding:5px 0; margin-top:5px; line-height:30px; border-top:1px solid #eee; dd.time { position:relative; width:100%; height:41px; padding:5px 0; margin-top:5px; line-height:30px; border-top:1px solid #eee;
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, 2); text-align:center; }
} }
.now { float:right; width:50px; height:30px; border-radius:3px; background:nth($cp, 1);text-align:center; .now { float:right; width:50px; height:30px; border-radius:3px; background:nth($cp, 2);text-align:center;
} }
} }
@ -87,14 +87,14 @@
.ok,.cancel {display:inline-block;width:60px; height:30px;margin:0 0 0 10px;border-radius:3px;text-align:center;cursor:pointer;} .ok,.cancel {display:inline-block;width:60px; height:30px;margin:0 0 0 10px;border-radius:3px;text-align:center;cursor:pointer;}
.ok { background:nth($ct, 1); color:#fff; .ok { background:nth($ct, 2); color:#fff;
&:hover { background:nth($ct, 2); } &:hover { background:nth($ct, 1); }
&:active { background:nth($ct, 3); } &:active { background:nth($ct, 3); }
} }
.cancel {background:nth($cp, 1);} .cancel {background:nth($cp, 2);}
} }
dd.tips { position:absolute; z-index:65535; left:25%; top:40%; width:50%; height:30px; line-height:28px; background:#fffbed;color:nth($co, 3);border:1px solid nth($co, 1);border-radius:5px; font-size:12px; text-align:center; } dd.tips { position:absolute; z-index:65535; left:25%; top:40%; width:50%; height:30px; line-height:28px; background:#fffbed;color:nth($co, 3);border:1px solid nth($co, 2);border-radius:5px; font-size:12px; text-align:center; }
} }
} }

12
src/js/form/index.js
View File

@ -249,7 +249,6 @@ Anot.component('input', {
next() next()
}, },
render() { render() {
// console.log(this.props)
let { icon, placeholder } = this.props let { icon, placeholder } = this.props
let holder = ` let holder = `
<span <span
@ -261,6 +260,7 @@ Anot.component('input', {
class="do-input__input" class="do-input__input"
:attr="{disabled: disabled, type: props.type }" :attr="{disabled: disabled, type: props.type }"
:duplex="value" :duplex="value"
:keyup="onKeyup"
:blur="onBlur" :blur="onBlur"
:focus="onFocus" />` :focus="onFocus" />`
let ico = icon ? `<i class="do-input__icon do-icon-${icon}"></i>` : '' let ico = icon ? `<i class="do-input__icon do-icon-${icon}"></i>` : ''
@ -278,7 +278,8 @@ Anot.component('input', {
type: 'text', type: 'text',
width: 180, width: 180,
placeholder: '', placeholder: '',
default: '' default: '',
submit: Anot.PropsTypes.isFunction() // on key `ENTER`
}, },
methods: { methods: {
onFocus() { onFocus() {
@ -286,6 +287,13 @@ Anot.component('input', {
}, },
onBlur() { onBlur() {
this.active = false this.active = false
},
onKeyup(ev) {
if (ev.keyCode === 13) {
if (typeof this.props.submit === 'function') {
this.props.submit()
}
}
} }
} }
}) })

192
src/js/form/style.scss
View File

@ -37,17 +37,17 @@
} }
&.teal {color:nth($ct, 1);} &.teal {color:nth($ct, 2);}
&.green {color:nth($cg, 1);} &.green {color:nth($cg, 2);}
&.blue {color:nth($cb, 1);} &.blue {color:nth($cb, 2);}
&.purple {color:nth($cpp, 1);} &.purple {color:nth($cpp, 2);}
&.red {color:nth($cr, 1);} &.red {color:nth($cr, 2);}
&.orange {color:nth($co, 1);} &.orange {color:nth($co, 2);}
&.plain {color:nth($cp, 3);} &.plain {color:nth($cp, 3);}
&.grey {color:nth($cgr, 1);} &.grey {color:nth($cgr, 2);}
&.dark {color:nth($cd, 1);} &.dark {color:nth($cd, 2);}
&.disabled {color:nth($cp, 1);cursor:not-allowed; &.disabled {color:nth($cp, 2);cursor:not-allowed;
&::before {display:none;} &::before {display:none;}
} }
@ -57,57 +57,57 @@
.do-radio {position:relative;display:inline-block;width:auto;height:30px;padding-right:10px;line-height:30px;text-align:center;cursor:default;font-size:14px; .do-radio {position:relative;display:inline-block;width:auto;height:30px;padding-right:10px;line-height:30px;text-align:center;cursor:default;font-size:14px;
&__box {float:left;width:20px;height:20px;margin:5px;margin-left:0;border:1px solid nth($cgr, 1);border-radius:50%;} &__box {float:left;width:20px;height:20px;margin:5px;margin-left:0;border:1px solid nth($cgr, 2);border-radius:50%;}
&.checked &__box::after {display:block;width:14px;height:14px;margin:2px;border-radius:50%;content:""} &.checked &__box::after {display:block;width:14px;height:14px;margin:2px;border-radius:50%;content:""}
&.teal &__box {border-color:nth($ct, 1); &.teal &__box {border-color:nth($ct, 2);
&::after {background:nth($ct, 1);} &::after {background:nth($ct, 2);}
} }
&.teal {color:nth($ct, 1);} &.teal {color:nth($ct, 2);}
&.green &__box {border-color:nth($cg, 1); &.green &__box {border-color:nth($cg, 2);
&::after {background:nth($cg, 1);} &::after {background:nth($cg, 2);}
} }
&.green {color:nth($cg, 1);} &.green {color:nth($cg, 2);}
&.blue &__box {border-color:nth($cb, 1); &.blue &__box {border-color:nth($cb, 2);
&::after {background:nth($cb, 1);} &::after {background:nth($cb, 2);}
} }
&.blue {color:nth($cb, 1);} &.blue {color:nth($cb, 2);}
&.purple &__box {border-color:nth($cpp, 1); &.purple &__box {border-color:nth($cpp, 2);
&::after {background:nth($cpp, 1);} &::after {background:nth($cpp, 2);}
} }
&.purple {color:nth($cpp, 1);} &.purple {color:nth($cpp, 2);}
&.red &__box {border-color:nth($cr, 1); &.red &__box {border-color:nth($cr, 2);
&::after {background:nth($cr, 1);} &::after {background:nth($cr, 2);}
} }
&.red {color:nth($cr, 1);} &.red {color:nth($cr, 2);}
&.orange &__box {border-color:nth($co, 1); &.orange &__box {border-color:nth($co, 2);
&::after {background:nth($co, 1);} &::after {background:nth($co, 2);}
} }
&.orange {color:nth($co, 1);} &.orange {color:nth($co, 2);}
&.plain &__box {border-color:nth($cp, 3); &.plain &__box {border-color:nth($cp, 3);
&::after {background:nth($cp, 3);} &::after {background:nth($cp, 3);}
} }
&.plain {color:nth($cp, 3);} &.plain {color:nth($cp, 3);}
&.grey &__box {border-color:nth($cgr, 1); &.grey &__box {border-color:nth($cgr, 2);
&::after {background:nth($cgr, 1);} &::after {background:nth($cgr, 2);}
} }
&.grey {color:nth($cgr, 1);} &.grey {color:nth($cgr, 2);}
&.dark &__box {border-color:nth($cd, 1); &.dark &__box {border-color:nth($cd, 2);
&::after {background:nth($cd, 1);} &::after {background:nth($cd, 2);}
} }
&.dark {color:nth($cd, 1);} &.dark {color:nth($cd, 2);}
&.disabled {color:nth($cp, 3);cursor:not-allowed;text-decoration:line-through;} &.disabled {color:nth($cp, 3);cursor:not-allowed;text-decoration:line-through;}
&.disabled.checked {color:nth($cd, 2);} &.disabled.checked {color:nth($cd, 1);}
&.disabled &__box {border-color:nth($cp, 3); &.disabled &__box {border-color:nth($cp, 3);
&::after {background:nth($cp, 3);} &::after {background:nth($cp, 3);}
} }
@ -127,35 +127,35 @@
&.checked &__dot {left:auto;right:0;} &.checked &__dot {left:auto;right:0;}
&.teal.checked &__dot {background:nth($ct, 1);} &.teal.checked &__dot {background:nth($ct, 2);}
&.teal.checked &__label {background:nth($ct, 2) + a0;} &.teal.checked &__label {background:nth($ct, 1) + a0;}
&.green.checked &__dot {background:nth($cg, 1);} &.green.checked &__dot {background:nth($cg, 2);}
&.green.checked &__label {background:nth($cg, 2) + a0;} &.green.checked &__label {background:nth($cg, 1) + a0;}
&.blue.checked &__dot {background:nth($cb, 1);} &.blue.checked &__dot {background:nth($cb, 2);}
&.blue.checked &__label {background:nth($cb, 2) + a0;} &.blue.checked &__label {background:nth($cb, 1) + a0;}
&.purple.checked &__dot {background:nth($cpp, 1);} &.purple.checked &__dot {background:nth($cpp, 2);}
&.purple.checked &__label {background:nth($cpp, 2) + a0;} &.purple.checked &__label {background:nth($cpp, 1) + a0;}
&.red.checked &__dot {background:nth($cr, 1);} &.red.checked &__dot {background:nth($cr, 2);}
&.red.checked &__label {background:nth($cr, 2) + a0;} &.red.checked &__label {background:nth($cr, 1) + a0;}
&.orange.checked &__dot {background:nth($co, 1);} &.orange.checked &__dot {background:nth($co, 2);}
&.orange.checked &__label {background:nth($co, 2) + a0;} &.orange.checked &__label {background:nth($co, 1) + a0;}
&.plain.checked &__dot {background:nth($cp, 3);} &.plain.checked &__dot {background:nth($cp, 3);}
&.plain.checked &__label {background:nth($cp, 2);} &.plain.checked &__label {background:nth($cp, 2);}
&.grey.checked &__dot {background:nth($cgr, 1);} &.grey.checked &__dot {background:nth($cgr, 2);}
&.grey.checked &__label {background:nth($cgr, 2) + a0;} &.grey.checked &__label {background:nth($cgr, 1) + a0;}
&.dark.checked &__dot {background:nth($cd, 1);} &.dark.checked &__dot {background:nth($cd, 2);}
&.dark.checked &__label {background:nth($cd, 2) + a0;} &.dark.checked &__label {background:nth($cd, 1) + a0;}
&.disabled.checked &__dot {background:#fff;} &.disabled.checked &__dot {background:#fff;}
&.disabled &__label, &.disabled.checked &__label {background:nth($cp, 2); &.disabled &__label, &.disabled.checked &__label {background:nth($cp, 1);
&::before {display:block;position:absolute;top:6px;width:8px;height:4px;border-radius:2px;background:#fff;content:"";} &::before {display:block;position:absolute;top:6px;width:8px;height:4px;border-radius:2px;background:#fff;content:"";}
} }
@ -167,57 +167,57 @@
.do-checkbox {position:relative;display:inline-block;width:auto;height:30px;padding-right:10px;line-height:30px;text-align:center;cursor:default;font-size:14px; .do-checkbox {position:relative;display:inline-block;width:auto;height:30px;padding-right:10px;line-height:30px;text-align:center;cursor:default;font-size:14px;
&__box {float:left;width:20px;height:20px;margin:5px;margin-left:0;line-height:18px;border:1px solid nth($cgr, 1);border-radius:3px;font-size:18px;text-align:center; &__box {float:left;width:20px;height:20px;margin:5px;margin-left:0;line-height:18px;border:1px solid nth($cgr, 2);border-radius:3px;font-size:18px;text-align:center;
} }
&.checked &__box {color:#fff;font-weight:bold;} &.checked &__box {color:#fff;font-weight:bold;}
&.grey {color:nth($cgr, 1);} &.grey {color:nth($cgr, 2);}
&.grey &__box {border-color:nth($cgr, 1);} &.grey &__box {border-color:nth($cgr, 2);}
&.grey.checked &__box {background:nth($cgr, 1);} &.grey.checked &__box {background:nth($cgr, 2);}
&.dark {color:nth($cd, 1);} &.dark {color:nth($cd, 2);}
&.dark &__box {border-color:nth($cd, 1);} &.dark &__box {border-color:nth($cd, 2);}
&.dark.checked &__box {background:nth($cd, 1);} &.dark.checked &__box {background:nth($cd, 2);}
&.teal {color:nth($ct, 1);} &.teal {color:nth($ct, 2);}
&.teal &__box {border-color:nth($ct, 1);} &.teal &__box {border-color:nth($ct, 2);}
&.teal.checked &__box {background:nth($ct, 1);} &.teal.checked &__box {background:nth($ct, 2);}
&.green {color:nth($cg, 1);} &.green {color:nth($cg, 2);}
&.green &__box {border-color:nth($cg, 1);} &.green &__box {border-color:nth($cg, 2);}
&.green.checked &__box {background:nth($cg, 1);} &.green.checked &__box {background:nth($cg, 2);}
&.blue {color:nth($cb, 1);} &.blue {color:nth($cb, 2);}
&.blue &__box {border-color:nth($cb, 1);} &.blue &__box {border-color:nth($cb, 2);}
&.blue.checked &__box {background:nth($cb, 1);} &.blue.checked &__box {background:nth($cb, 2);}
&.purple {color:nth($cpp, 1);} &.purple {color:nth($cpp, 2);}
&.purple &__box {border-color:nth($cpp, 1);} &.purple &__box {border-color:nth($cpp, 2);}
&.purple.checked &__box {background:nth($cpp, 1);} &.purple.checked &__box {background:nth($cpp, 2);}
&.orange {color:nth($co, 1);} &.orange {color:nth($co, 2);}
&.orange &__box {border-color:nth($co, 1);} &.orange &__box {border-color:nth($co, 2);}
&.orange.checked &__box {background:nth($co, 1);} &.orange.checked &__box {background:nth($co, 2);}
&.plain {color:nth($cp, 3);} &.plain {color:nth($cp, 3);}
&.plain &__box {border-color:nth($cp, 3);} &.plain &__box {border-color:nth($cp, 3);}
&.plain.checked &__box {background:nth($cp, 3);} &.plain.checked &__box {background:nth($cp, 3);}
&.red {color:nth($cr, 1);} &.red {color:nth($cr, 2);}
&.red &__box {border-color:nth($cr, 1);} &.red &__box {border-color:nth($cr, 2);}
&.red.checked &__box {background:nth($cr, 1);} &.red.checked &__box {background:nth($cr, 2);}
&.disabled {cursor:not-allowed;color:nth($cp, 3);text-decoration:line-through;} &.disabled {cursor:not-allowed;color:nth($cp, 3);text-decoration:line-through;}
&.disabled &__box {border-color:nth($cp, 3);} &.disabled &__box {border-color:nth($cp, 3);}
&.disabled.checked {color:nth($cd, 2);} &.disabled.checked {color:nth($cd, 1);}
&.disabled.checked &__box {background:nth($cp, 3);} &.disabled.checked &__box {background:nth($cp, 3);}
} }
.do-input {position:relative;display:inline-block;width:180px;height:30px;line-height:30px;border-bottom:1px solid nth($cp, 1);cursor:default;font-size:14px; .do-input {position:relative;display:inline-block;width:180px;height:30px;line-height:30px;border-bottom:1px solid nth($cp, 2);cursor:default;font-size:14px;
&.icon-left {padding-left:30px;} &.icon-left {padding-left:30px;}
&.icon-right {padding-right:30px;} &.icon-right {padding-right:30px;}
@ -226,7 +226,7 @@
&.visible {visibility:visible;} &.visible {visibility:visible;}
} }
&__input {position:relative;width:100%;height:30px;padding:0 5px;border:0;background:none;font-size:14px;color:nth($cd, 1);} &__input {position:relative;width:100%;height:30px;padding:0 5px;border:0;background:none;font-size:14px;color:nth($cd, 2);}
&__icon {position:absolute;bottom:0;width:30px;height:30px;text-align:center;font-size:20px;} &__icon {position:absolute;bottom:0;width:30px;height:30px;text-align:center;font-size:20px;}
&::after {position:absolute;left:50%;bottom:-1px;width:0;height:2px;content:"";transition:left .15s linear,width .15s linear;} &::after {position:absolute;left:50%;bottom:-1px;width:0;height:2px;content:"";transition:left .15s linear,width .15s linear;}
@ -240,36 +240,36 @@
&.icon-left &__holder {padding-left:30px;} &.icon-left &__holder {padding-left:30px;}
&.icon-right &__holder {padding-right:30px;} &.icon-right &__holder {padding-right:30px;}
&.grey {color:nth($cgr, 1); &.grey {color:nth($cgr, 2);
&::after {background:nth($cgr, 2);} &::after {background:nth($cgr, 1);}
} }
&.dark {color:nth($cd, 1); &.dark {color:nth($cd, 2);
&::after {background:nth($cd, 2);} &::after {background:nth($cd, 1);}
} }
&.teal{color:nth($ct, 1); &.teal{color:nth($ct, 2);
&::after {background:nth($ct, 2);} &::after {background:nth($ct, 1);}
} }
&.green {color:nth($cg, 1); &.green {color:nth($cg, 2);
&::after {background:nth($cg, 2);} &::after {background:nth($cg, 1);}
} }
&.red {color:nth($cr, 1); &.red {color:nth($cr, 2);
&::after {background:nth($cr, 2);} &::after {background:nth($cr, 1);}
} }
&.blue {color:nth($cb, 1); &.blue {color:nth($cb, 2);
&::after {background:nth($cb, 2);} &::after {background:nth($cb, 1);}
} }
&.purple {color:nth($cpp, 1); &.purple {color:nth($cpp, 2);
&::after {background:nth($cpp, 2);} &::after {background:nth($cpp, 1);}
} }
&.orange {color:nth($co, 1); &.orange {color:nth($co, 2);
&::after {background:nth($co, 2);} &::after {background:nth($co, 1);}
} }
&.disabled {background:#fff8ed;color:nth($cp, 3);} &.disabled {background:#fff8ed;color:nth($cp, 3);}

18
src/js/layer/skin/normal.scss
View File

@ -36,7 +36,7 @@
/* 弹层标题栏 */ /* 弹层标题栏 */
.layer-title {width:100%;height:43px;padding:0 10px;line-height:43px;font-size:16px;color:nth($cd, 1);} .layer-title {width:100%;height:43px;padding:0 10px;line-height:43px;font-size:16px;color:nth($cd, 2);}
/* 弹层主体内容 */ /* 弹层主体内容 */
.layer-content {position:relative;width:100%;height:auto;min-height:50px;padding:10px;word-break:break-all;word-wrap: break-word; .layer-content {position:relative;width:100%;height:auto;min-height:50px;padding:10px;word-break:break-all;word-wrap: break-word;
@ -45,8 +45,8 @@
.prompt-value {width: 100%;height: 30px;padding: 0 8px;border: 1px solid #ddd;border-radius: 3px; .prompt-value {width: 100%;height: 30px;padding: 0 8px;border: 1px solid #ddd;border-radius: 3px;
&.alert {border-color:nth($cr, 1)} &.alert {border-color:nth($cr, 2)}
&:focus {border-color:nth($ct, 1)} &:focus {border-color:nth($ct, 2)}
} }
.msg-box {line-height:30px;} .msg-box {line-height:30px;}
} }
@ -55,14 +55,14 @@
/* 弹层按钮部分 */ /* 弹层按钮部分 */
.layer-ctrl {width:100%;height:40px;padding:5px 0;line-height:30px;font-size:14px;color:#454545;text-align:right; .layer-ctrl {width:100%;height:40px;padding:5px 0;line-height:30px;font-size:14px;color:#454545;text-align:right;
a {overflow:hidden;position:relative;display:inline-block;width:auto;min-width:60px;height:30px;margin-left:5px;padding:0 10px;color:nth($ct, 1);text-align:center;cursor:pointer; a {overflow:hidden;position:relative;display:inline-block;width:auto;min-width:60px;height:30px;margin-left:5px;padding:0 10px;color:nth($ct, 2);text-align:center;cursor:pointer;
&::before {position:absolute;left:-50%;top:-50%;z-index:-1;display:block;width:200%;height:200%;border-radius:50%;background:nth($cp, 2); content:"";opacity:0;transform: scale(0, .0); transition:opacity 1.3s cubic-bezier(0.23, 1, 0.32, 1),transform 1.3s cubic-bezier(0.23, 1, 0.32, 1);} &::before {position:absolute;left:-50%;top:-50%;z-index:-1;display:block;width:200%;height:200%;border-radius:50%;background:nth($cp, 1); content:"";opacity:0;transform: scale(0, .0); transition:opacity 1.3s cubic-bezier(0.23, 1, 0.32, 1),transform 1.3s cubic-bezier(0.23, 1, 0.32, 1);}
&:hover { &:hover {
&::before {opacity:1;transform:scale(1, .8);} &::before {opacity:1;transform:scale(1, .8);}
} }
&:active {background:nth($cp, 1)} &:active {background:nth($cp, 2)}
} }
} }
@ -104,9 +104,9 @@
.toast-box {display:inline-block;position:relative;min-height:40px;padding:5px 12px 5px 50px;line-height:28px;border-radius:3px;word-break: break-all; .toast-box {display:inline-block;position:relative;min-height:40px;padding:5px 12px 5px 50px;line-height:28px;border-radius:3px;word-break: break-all;
&.style-info {border:1px solid nth($ct, 1);background:#edfbf8;color:nth($ct, 3);} &.style-info {border:1px solid nth($ct, 2);background:#edfbf8;color:nth($ct, 3);}
&.style-warn {border:1px solid nth($co, 1);background:#fffbed;color:nth($co, 3);} &.style-warn {border:1px solid nth($co, 2);background:#fffbed;color:nth($co, 3);}
&.style-deny {border:1px solid nth($cr, 1);background:#fffbed;color:nth($cr, 3);} &.style-deny {border:1px solid nth($cr, 2);background:#fffbed;color:nth($cr, 3);}
>i {position:absolute;left:12px;top:5px;line-height:28px;font-size:26px;} >i {position:absolute;left:12px;top:5px;line-height:28px;font-size:26px;}
} }

10
src/js/marked/theme.scss
View File

@ -28,17 +28,17 @@
h6:before {display:block;position:absolute;left:0;top:50%;width:100%;content:" ";border-bottom:1px solid #ddd;} h6:before {display:block;position:absolute;left:0;top:50%;width:100%;content:" ";border-bottom:1px solid #ddd;}
a {text-decoration:underline;} a {text-decoration:underline;}
a:hover {color:nth($co, 1)} a:hover {color:nth($co, 2)}
p {margin:15px 0;} p {margin:15px 0;}
blockquote.md-quote {margin:10px 0;padding:5px 10px;border-left:5px solid nth($cp, 3);background:nth($cp, 2)} blockquote.md-quote {margin:10px 0;padding:5px 10px;border-left:5px solid nth($cp, 3);background:nth($cp, 1)}
blockquote.md-quote p {margin:0;} blockquote.md-quote p {margin:0;}
/* 提醒文本 */ /* 提醒文本 */
.md-warn,.md-mark {display:inline-block;position:relative;min-height:40px;margin:5px 0;padding:5px 8px 5px 50px;border:1px solid nth($co, 1);border-radius:5px;background:#fffbed;color:nth($co, 3);word-break: break-all; .md-warn,.md-mark {display:inline-block;position:relative;min-height:40px;margin:5px 0;padding:5px 8px 5px 50px;border:1px solid nth($co, 2);border-radius:5px;background:#fffbed;color:nth($co, 3);word-break: break-all;
p {margin:0!important;} p {margin:0!important;}
&::before {position:absolute;left:15px;top:5px;font:20px/1.5 "ui font";color:nth($cr, 1);content:"\e6f6";} &::before {position:absolute;left:15px;top:5px;font:20px/1.5 "ui font";color:nth($cr, 2);content:"\e6f6";}
} }
.md-mark {border-color:nth($ct, 2);color:nth($ct, 3);background:#edfbf8; .md-mark {border-color:nth($ct, 1);color:nth($ct, 3);background:#edfbf8;
&::before {color:nth($ct, 3);content:"\e657";} &::before {color:nth($ct, 3);content:"\e657";}
} }

24
src/js/meditor/addon/attach.scss
View File

@ -7,15 +7,15 @@
*/ */
@import 'var.scss'; @import 'var.scss';
.do-meditor-attach {width:630px;height:300px;cursor:default;color:nth($cd, 1); .do-meditor-attach {width:630px;height:300px;cursor:default;color:nth($cd, 2);
::-webkit-scrollbar {width:5px;height:5px;background:nth($cp, 2);} ::-webkit-scrollbar {width:5px;height:5px;background:nth($cp, 1);}
::-webkit-scrollbar:hover {background:nth($cp, 1);} ::-webkit-scrollbar:hover {background:nth($cp, 2);}
::-webkit-scrollbar-button {display:none;} ::-webkit-scrollbar-button {display:none;}
::-webkit-scrollbar-thumb {background:nth($cgr, 2);} ::-webkit-scrollbar-thumb {background:nth($cgr, 1);}
::-webkit-scrollbar-thumb:hover {background:nth($cgr, 1);} ::-webkit-scrollbar-thumb:hover {background:nth($cgr, 2);}
.tab-box {float:left;width:130px;height:300px;padding:10px 5px;text-align:center;background:nth($cp, 2);border-radius:5px; .tab-box {float:left;width:130px;height:300px;padding:10px 5px;text-align:center;background:nth($cp, 1);border-radius:5px;
.item {display:block;width:100%;height:40px;line-height:40px;border-radius:3px;cursor:pointer; .item {display:block;width:100%;height:40px;line-height:40px;border-radius:3px;cursor:pointer;
@ -34,16 +34,16 @@
.section {display:block;width:100%;height:auto;margin:15px 0;line-height:35px; .section {display:block;width:100%;height:auto;margin:15px 0;line-height:35px;
.txt {width:100%;height:45px;padding:0 10px;border:0;border-radius:5px;background:nth($cp, 2);color:nth($cd, 1);font-size:14px;} .txt {width:100%;height:45px;padding:0 10px;border:0;border-radius:5px;background:nth($cp, 1);color:nth($cd, 2);font-size:14px;}
.submit {float:right;width:30%;height:45px;line-height:45px;} .submit {float:right;width:30%;height:45px;line-height:45px;}
} }
.select-file {width:100%;height:35px;line-height:35px; .select-file {width:100%;height:35px;line-height:35px;
.file {float:left;width:100px;height:35px;border-radius:3px;background:nth($cp, 1);text-align:center;cursor:pointer; .file {float:left;width:100px;height:35px;border-radius:3px;background:nth($cp, 2);text-align:center;cursor:pointer;
&:hover {background:nth($cp, 2);} &:hover {background:nth($cp, 1);}
&:active {background:nth($cp, 3);} &:active {background:nth($cp, 3);}
} }
.tips {display:inline-block;padding:0 10px;} .tips {display:inline-block;padding:0 10px;}
@ -51,7 +51,7 @@
.upload-box {width:100%;height:auto;min-height:255px;padding-top:10px; .upload-box {width:100%;height:auto;min-height:255px;padding-top:10px;
.thead {width:100%;height:35px;line-height:35px;background:nth($cp, 2);} .thead {width:100%;height:35px;line-height:35px;background:nth($cp, 1);}
.thead .col {text-align:center;} .thead .col {text-align:center;}
.col {float:left;height:30px;padding:0 5px;} .col {float:left;height:30px;padding:0 5px;}
@ -63,14 +63,14 @@
p {display:block;width:100%;height:30px;line-height:30px;} p {display:block;width:100%;height:30px;line-height:30px;}
} }
.insert {display:inline-block;padding:3px 5px;line-height:13px;background:nth($cp, 2);color:nth($cd, 1);cursor:pointer;} .insert {display:inline-block;padding:3px 5px;line-height:13px;background:nth($cp, 1);color:nth($cd, 2);cursor:pointer;}
.red {color:#f30;} .red {color:#f30;}
} }
.manager {overflow:hidden;overflow-y:auto;width:100%;height:300px; .manager {overflow:hidden;overflow-y:auto;width:100%;height:300px;
.list-box {width:100%;column-count:4;column-gap: 5;} .list-box {width:100%;column-count:4;column-gap: 5;}
.item {margin:0 0 10px;padding:5px;text-align:center;background:nth($cp, 2); break-inside: avoid;@include ts(background); .item {margin:0 0 10px;padding:5px;text-align:center;background:nth($cp, 1); break-inside: avoid;@include ts(background);
&:hover {background:nth($cp, 3)} &:hover {background:nth($cp, 3)}

32
src/js/meditor/skin/main.scss
View File

@ -14,18 +14,18 @@
.do-meditor {position:relative;display:block;width:100%;height:100%;padding-top:41px;border:1px solid nth($cp, 3);background:#fff;color:nth($cgr, 3); .do-meditor {position:relative;display:block;width:100%;height:100%;padding-top:41px;border:1px solid nth($cp, 3);background:#fff;color:nth($cgr, 3);
::-webkit-scrollbar {width:5px;height:5px;background:nth($cp, 2);} ::-webkit-scrollbar {width:5px;height:5px;background:nth($cp, 1);}
::-webkit-scrollbar:hover {background:nth($cp, 1);} ::-webkit-scrollbar:hover {background:nth($cp, 2);}
::-webkit-scrollbar-button {display:none;} ::-webkit-scrollbar-button {display:none;}
::-webkit-scrollbar-thumb {background:nth($cgr, 2);} ::-webkit-scrollbar-thumb {background:nth($cgr, 1);}
::-webkit-scrollbar-thumb:hover {background:nth($cgr, 1);} ::-webkit-scrollbar-thumb:hover {background:nth($cgr, 2);}
&.disabled{border-color:nth($co, 2); &.disabled{border-color:nth($co, 1);
&::after {position:absolute;left:0;top:0;z-index:100;width:100%;height:100%;content:"";background:rgba(255, 182, 24, 0.07);} &::after {position:absolute;left:0;top:0;z-index:100;width:100%;height:100%;content:"";background:rgba(255, 182, 24, 0.07);}
} }
.tool-bar {overflow:hidden;position:absolute;top:0;left:0;z-index:99;width:100%;height:41px;line-height:40px;border-bottom:1px solid nth($cp, 1);background:#fff;color:nth($cd, 1);text-align:center;font-size:24px; .tool-bar {overflow:hidden;position:absolute;top:0;left:0;z-index:99;width:100%;height:41px;line-height:40px;border-bottom:1px solid nth($cp, 2);background:#fff;color:nth($cd, 2);text-align:center;font-size:24px;
span {float:left;width:40px;height:40px; span {float:left;width:40px;height:40px;
@ -79,20 +79,20 @@
.do-meditor__button {overflow:hidden;position:relative;display:inline-block;width:auto;min-width:60px;height:40px;margin-left:5px;padding:0 10px;line-height:40px;color:nth($ct, 1);text-align:center; .do-meditor__button {overflow:hidden;position:relative;display:inline-block;width:auto;min-width:60px;height:40px;margin-left:5px;padding:0 10px;line-height:40px;color:nth($ct, 2);text-align:center;
&::before {position:absolute;left:-50%;top:-50%;z-index:-1;display:block;width:200%;height:200%;border-radius:50%;background:nth($cp, 2); content:"";opacity:0;transform: scale(0, .0); transition:opacity 1.3s cubic-bezier(0.23, 1, 0.32, 1),transform 1.3s cubic-bezier(0.23, 1, 0.32, 1);} &::before {position:absolute;left:-50%;top:-50%;z-index:-1;display:block;width:200%;height:200%;border-radius:50%;background:nth($cp, 1); content:"";opacity:0;transform: scale(0, .0); transition:opacity 1.3s cubic-bezier(0.23, 1, 0.32, 1),transform 1.3s cubic-bezier(0.23, 1, 0.32, 1);}
&:hover { &:hover {
&::before {opacity:1;transform:scale(1, .8);} &::before {opacity:1;transform:scale(1, .8);}
} }
&:active {background:nth($cp, 1)} &:active {background:nth($cp, 2)}
} }
/* 关于编辑器模块*/ /* 关于编辑器模块*/
.do-meditor-about {width:400px;padding:10px 20px; .do-meditor-about {width:400px;padding:10px 20px;
pre {width:100%;padding-bottom:15px;line-height:1;font-size:14px;} pre {width:100%;padding-bottom:15px;line-height:1;font-size:14px;}
a {color:#049789} a {color:nth($ct, 1)}
p {margin:0 auto 5px;} p {margin:0 auto 5px;}
} }
@ -125,11 +125,11 @@
} }
/*通用输入模块, 链接/图片插入/文件插入/代码块插入*/ /*通用输入模块, 链接/图片插入/文件插入/代码块插入*/
.do-meditor-common {width:360px;height:auto;padding:0 20px;font-size:14px;color:nth($cd, 2); .do-meditor-common {width:360px;height:auto;padding:0 20px;font-size:14px;color:nth($cd, 1);
section {width:100%;height: 40px;margin:10px 0;line-height:40px; section {width:100%;height: 40px;margin:10px 0;line-height:40px;
.txt {width:100%;height:40px;padding:0 10px;border:0;border-radius:5px;background:nth($cp, 2);color:nth($cd, 1);font-size:14px;} .txt {width:100%;height:40px;padding:0 10px;border:0;border-radius:5px;background:nth($cp, 1);color:nth($cd, 2);font-size:14px;}
.label {float: left;width:50%;} .label {float: left;width:50%;}
.submit {float:right;width:30%;} .submit {float:right;width:30%;}
} }
@ -139,15 +139,15 @@
section {display:block;width:100%;height:auto;margin:10px 0;line-height:35px; section {display:block;width:100%;height:auto;margin:10px 0;line-height:35px;
.label {float: left;width:80px;} .label {float: left;width:80px;}
select {float:left;width:200px;height:35px;padding:0 30px 0 10px;border:0;border-radius:0;border-bottom:1px solid nth($cp, 3);background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAMCAMAAABV0m3JAAAADFBMVEUAAAD///+Pj4+JiYkxcGihAAAABHRSTlMAABBwqVQF9wAAADNJREFUeNqlzjEOACAMw8DQ/v/PSE5FFhaEx5usdekBuzRVH0RtCqJYELUFrVjQigX/5jdvzgDh9izlMQAAAABJRU5ErkJggg==) no-repeat right 12px;color:nth($cd, 1);outline:none;-webkit-appearance:none;-moz-appearance: none;@include ts; select {float:left;width:200px;height:35px;padding:0 30px 0 10px;border:0;border-radius:0;border-bottom:1px solid nth($cp, 3);background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAMCAMAAABV0m3JAAAADFBMVEUAAAD///+Pj4+JiYkxcGihAAAABHRSTlMAABBwqVQF9wAAADNJREFUeNqlzjEOACAMw8DQ/v/PSE5FFhaEx5usdekBuzRVH0RtCqJYELUFrVjQigX/5jdvzgDh9izlMQAAAABJRU5ErkJggg==) no-repeat right 12px;color:nth($cd, 2);outline:none;-webkit-appearance:none;-moz-appearance: none;@include ts;
&::-ms-expand {display:none;} &::-ms-expand {display:none;}
&:focus {box-shadow:0 0 5px nth($ct, 2)} &:focus {box-shadow:0 0 5px nth($ct, 1)}
} }
textarea {width:100%;height:300px;padding:5px 10px;border:0;border-radius:5px;background:nth($cp, 2);font-size:14px;resize:none;outline:none;color:nth($cd, 1); textarea {width:100%;height:300px;padding:5px 10px;border:0;border-radius:5px;background:nth($cp, 1);font-size:14px;resize:none;outline:none;color:nth($cd, 2);
&:focus {box-shadow:0 0 5px nth($ct, 2)} &:focus {box-shadow:0 0 5px nth($ct, 1)}
} }
.submit {float:right;width:80px;} .submit {float:right;width:80px;}
} }

60
src/js/pager/main.scss
View File

@ -8,7 +8,7 @@
@import "var.scss"; @import "var.scss";
.do-pager {display:block;height:auto;text-align:center;font-size:14px;color: nth($cgr, 1); .do-pager {display:block;height:auto;text-align:center;font-size:14px;color: nth($cgr, 2);
&.mini {line-height:30px; &.mini {line-height:30px;
.button,.page {min-width:30px;height:30px} .button,.page {min-width:30px;height:30px}
@ -20,7 +20,7 @@
.button,.page {min-width:40px;height:40px} .button,.page {min-width:40px;height:40px}
} }
.button,.page {display:inline-block;border:0;color: nth($cgr, 1);text-decoration:none;cursor:pointer;vertical-align:top;font-size:14px;font-weight:100;appearance:none;} .button,.page {display:inline-block;border:0;color: nth($cgr, 2);text-decoration:none;cursor:pointer;vertical-align:top;font-size:14px;font-weight:100;appearance:none;}
.button {font-size:18px;} .button {font-size:18px;}
.curr, .disabled {cursor:default;} .curr, .disabled {cursor:default;}
@ -32,10 +32,10 @@
.curr {padding:0 8px;margin:0 3px;} .curr {padding:0 8px;margin:0 3px;}
.curr {font-weight:bold;font-size:15px;} .curr {font-weight:bold;font-size:15px;}
.page.disabled {min-width:0;padding:0;background:none;color:nth($cgr, 1); .page.disabled {min-width:0;padding:0;background:none;color:nth($cgr, 2);
&:hover,&:active {background:none;} &:hover,&:active {background:none;}
} }
.page.curr {background:none;color:nth($cgr, 1); .page.curr {background:none;color:nth($cgr, 2);
&:hover,&:active {background:none;} &:hover,&:active {background:none;}
} }
.button[disabled] {cursor:not-allowed;} .button[disabled] {cursor:not-allowed;}
@ -59,92 +59,92 @@
} }
&.plain { &.plain {
.page,.button {background:nth($cp, 1);color:nth($cgr, 1); .page,.button {background:nth($cp, 2);color:nth($cgr, 2);
&:hover {background:nth($cp, 2)} &:hover {background:nth($cp, 1)}
&:active {background:nth($cp, 3)} &:active {background:nth($cp, 3)}
} }
.button[disabled] {background:nth($cp, 1);} .button[disabled] {background:nth($cp, 2);}
&.skin-2 .curr {background:nth($cp, 3)} &.skin-2 .curr {background:nth($cp, 3)}
} }
&.grey { &.grey {
.page,.button {background:nth($cgr, 1);color: #fff; .page,.button {background:nth($cgr, 2);color: #fff;
&:hover {background:nth($cgr, 2)} &:hover {background:nth($cgr, 1)}
&:active {background:nth($cgr, 3)} &:active {background:nth($cgr, 3)}
} }
.button[disabled] {background:nth($cgr, 1);} .button[disabled] {background:nth($cgr, 2);}
&.skin-2 .curr {background:nth($cgr, 3)} &.skin-2 .curr {background:nth($cgr, 3)}
} }
&.dark { &.dark {
.page,.button {background:nth($cd, 1);color: #fff; .page,.button {background:nth($cd, 2);color: #fff;
&:hover {background:nth($cd, 2)} &:hover {background:nth($cd, 2)}
&:active {background:nth($cd, 3)} &:active {background:nth($cd, 3)}
} }
.button[disabled] {background:nth($cd, 1);} .button[disabled] {background:nth($cd, 2);}
&.skin-2 .curr {background:nth($cd, 3)} &.skin-2 .curr {background:nth($cd, 3)}
} }
&.red { &.red {
.page,.button {background:nth($cr, 1);color: #fff; .page,.button {background:nth($cr, 2);color: #fff;
&:hover {background:nth($cr, 2)} &:hover {background:nth($cr, 1)}
&:active {background:nth($cr, 3)} &:active {background:nth($cr, 3)}
} }
.button[disabled] {background:nth($cr, 1);} .button[disabled] {background:nth($cr, 2);}
&.skin-2 .curr {background:nth($cr, 3)} &.skin-2 .curr {background:nth($cr, 3)}
} }
&.orange { &.orange {
.page,.button {background:nth($co, 1);color: #fff; .page,.button {background:nth($co, 2);color: #fff;
&:hover {background:nth($co, 2)} &:hover {background:nth($co, 1)}
&:active {background:nth($co, 3)} &:active {background:nth($co, 3)}
} }
.button[disabled] {background:nth($co, 1);} .button[disabled] {background:nth($co, 2);}
&.skin-2 .curr {background:nth($co, 3)} &.skin-2 .curr {background:nth($co, 3)}
} }
&.green { &.green {
.page,.button {background:nth($cg, 1);color: #fff; .page,.button {background:nth($cg, 2);color: #fff;
&:hover {background:nth($cg, 2)} &:hover {background:nth($cg, 1)}
&:active {background:nth($cg, 3)} &:active {background:nth($cg, 3)}
} }
.button[disabled] {background:nth($cg, 1);} .button[disabled] {background:nth($cg, 2);}
&.skin-2 .curr {background:nth($cg, 3)} &.skin-2 .curr {background:nth($cg, 3)}
} }
&.teal { &.teal {
.page,.button {background:nth($ct, 1);color: #fff; .page,.button {background:nth($ct, 2);color: #fff;
&:hover {background:nth($ct, 2)} &:hover {background:nth($ct, 1)}
&:active {background:nth($ct, 3)} &:active {background:nth($ct, 3)}
} }
.button[disabled] {background:nth($ct, 1);} .button[disabled] {background:nth($ct, 2);}
&.skin-2 .curr {background:nth($ct, 3)} &.skin-2 .curr {background:nth($ct, 3)}
} }
&.blue { &.blue {
.page,.button {background:nth($cb, 1);color: #fff; .page,.button {background:nth($cb, 2);color: #fff;
&:hover {background:nth($cb, 2)} &:hover {background:nth($cb, 1)}
&:active {background:nth($cb, 3)} &:active {background:nth($cb, 3)}
} }
.button[disabled] {background:nth($cb, 1);} .button[disabled] {background:nth($cb, 2);}
&.skin-2 .curr {background:nth($cb, 3)} &.skin-2 .curr {background:nth($cb, 3)}
} }
&.purple,.button { &.purple,.button {
.page {background:nth($cpp, 1);color: #fff; .page {background:nth($cpp, 2);color: #fff;
&:hover {background:nth($cpp, 2)} &:hover {background:nth($cpp, 1)}
&:active {background:nth($cpp, 3)} &:active {background:nth($cpp, 3)}
} }
.button[disabled] {background:nth($cpp, 1);} .button[disabled] {background:nth($cpp, 2);}
&.skin-2 .curr {background:nth($cpp, 3)} &.skin-2 .curr {background:nth($cpp, 3)}
} }

4
src/js/prism/highlight.scss
View File

@ -9,7 +9,7 @@
@import 'var.scss'; @import 'var.scss';
/*代码块*/ /*代码块*/
.do-ui-blockcode {position: relative;margin: 15px 0;padding: 8px 0;line-height: 1.5;border-radius:3px;background: nth($cp, 2); .do-ui-blockcode {position: relative;margin: 15px 0;padding: 8px 0;line-height: 1.5;border-radius:3px;background: nth($cp, 1);
/*语法高亮*/ /*语法高亮*/
.lang {position: relative;display: block;padding: 0 8px;color: #383a42;word-wrap: break-word;white-space: pre-wrap;font-family: Courier; .lang {position: relative;display: block;padding: 0 8px;color: #383a42;word-wrap: break-word;white-space: pre-wrap;font-family: Courier;
@ -46,4 +46,4 @@
} }
} }
/*行内代码*/ /*行内代码*/
.do-ui-inlinecode {display:inline-block;margin:0 2px;padding:0 5px;line-height: 1.5;color:#d14;background: nth($cp, 2);border-radius:3px;font-family: "Courier New";} .do-ui-inlinecode {display:inline-block;margin:0 2px;padding:0 5px;line-height: 1.5;color:#d14;background: nth($cp, 1);border-radius:3px;font-family: "Courier New";}

8
src/js/tree/main.scss
View File

@ -9,20 +9,20 @@
@import '../../css/var.scss'; @import '../../css/var.scss';
.do-tree {overflow:hidden;overflow-y:auto;position:relative;display:inline-block;width:100%;height:100%;line-height:36px;font-size:15px;color:nth($cd, 1); .do-tree {overflow:hidden;overflow-y:auto;position:relative;display:inline-block;width:100%;height:100%;line-height:36px;font-size:15px;color:nth($cd, 2);
&__item {overflow:hidden; min-height:35px;margin:1px 0; white-space:nowrap; text-overflow:ellipsis; &__item {overflow:hidden; min-height:35px;margin:1px 0; white-space:nowrap; text-overflow:ellipsis;
.do-tree {display:none;margin-left:20px;} .do-tree {display:none;margin-left:20px;}
em,span {display:inline-block;cursor:pointer;color:nth($cd, 2);} em,span {display:inline-block;cursor:pointer;color:nth($cd, 1);}
em {float:left;padding:0 5px;font-size:20px;} em {float:left;padding:0 5px;font-size:20px;}
span { span {
&:hover {color:nth($cd, 2);} &:hover {color:nth($cd, 1);}
&.active {color:nth($cd, 3);font-weight:bold;} &.active {color:nth($cd, 3);font-weight:bold;}
&.checkbox {float:left;position:relative;width:20px;height:20px;margin:8px 5px 8px 0;line-height:18px;border:1px solid nth($cd, 1);border-radius:3px; font-size:20px;text-align:center;} &.checkbox {float:left;position:relative;width:20px;height:20px;margin:8px 5px 8px 0;line-height:18px;border:1px solid nth($cd, 2);border-radius:3px; font-size:20px;text-align:center;}
} }
} }
&__item.open>.do-tree {display:block;} &__item.open>.do-tree {display:block;}