From c31c7cebba5a9367d85f7913c93b4da3b428c8c2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=AE=87=E5=A4=A9?= <yutent@doui.cc>
Date: Sun, 15 Jul 2018 19:43:34 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E5=9F=BA=E7=A1=80=E8=89=B2?=
 =?UTF-8?q?=E8=B0=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/css/var.scss                 |  18 +--
 src/js/datepicker/style.scss     |  32 +++---
 src/js/form/index.js             |  12 +-
 src/js/form/style.scss           | 192 +++++++++++++++----------------
 src/js/layer/skin/normal.scss    |  18 +--
 src/js/marked/theme.scss         |  10 +-
 src/js/meditor/addon/attach.scss |  24 ++--
 src/js/meditor/skin/main.scss    |  36 +++---
 src/js/pager/main.scss           |  60 +++++-----
 src/js/prism/highlight.scss      |   4 +-
 src/js/tree/main.scss            |   8 +-
 11 files changed, 211 insertions(+), 203 deletions(-)

diff --git a/src/css/var.scss b/src/css/var.scss
index 6b194fe..52cba55 100644
--- a/src/css/var.scss
+++ b/src/css/var.scss
@@ -1,12 +1,12 @@
-$ct: #19b491 #3fc2a7 #16967a;
-$cg: #2ecc71 #58d68d #27ae60;
-$cpp: #9b59b6 #ac61ce #8e44ad;
-$cb: #2d8dd6 #52a3de #2776b1;
-$cr: #eb3b48 #ff5061 #ce3742;
-$co: #f39c12 #ffb618 #e67e22;
-$cp: #e7e8eb #f3f5fb #bdc3c7;
-$cgr: #8a9b9c #98acae #748182;
-$cd: #526273 #62778d #34495e;
+$ct: #3fc2a7 #19b491 #16967a;
+$cg: #58d68d #2ecc71 #27ae60;
+$cpp: #ac61ce #9b59b6 #8e44ad;
+$cb: #52a3de #2d8dd6 #2776b1;
+$cr: #ff5061 #eb3b48 #ce3742;
+$co: #ffb618 #f39c12 #e67e22;
+$cp: #f3f5fb #e8ebf4 #dae1e9;
+$cgr: #98acae #8a9b9c #748182;
+$cd: #62778d #526273 #425064;
 
 @mixin ts($c: all, $t: .2s, $m: ease-in-out){
   transition:$c $t $m;
diff --git a/src/js/datepicker/style.scss b/src/js/datepicker/style.scss
index 08892ce..6115b7d 100644
--- a/src/js/datepicker/style.scss
+++ b/src/js/datepicker/style.scss
@@ -7,31 +7,31 @@
  */
 @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;}
   &.medium {width:175px;height:35px;line-height:35px;}
   &.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);}
   }
 
   .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;}
     }
     .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;
 
@@ -57,7 +57,7 @@
 
       .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 {
           &::before {opacity:1;transform:scale(1);}
@@ -65,9 +65,9 @@
 
         &.weeken {color:nth($ct, 3);}
         &.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;}
         }
@@ -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;
 
       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 { background:nth($ct, 1); color:#fff;
-        &:hover { background:nth($ct, 2); }
+      .ok { background:nth($ct, 2); color:#fff;
+        &:hover { background:nth($ct, 1); }
         &: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; }
   }
 }
 
diff --git a/src/js/form/index.js b/src/js/form/index.js
index e5d2f3b..539eaeb 100644
--- a/src/js/form/index.js
+++ b/src/js/form/index.js
@@ -249,7 +249,6 @@ Anot.component('input', {
     next()
   },
   render() {
-    // console.log(this.props)
     let { icon, placeholder } = this.props
     let holder = `
       <span 
@@ -261,6 +260,7 @@ Anot.component('input', {
         class="do-input__input"
         :attr="{disabled: disabled, type: props.type }"
         :duplex="value" 
+        :keyup="onKeyup"
         :blur="onBlur"
         :focus="onFocus" />`
     let ico = icon ? `<i class="do-input__icon do-icon-${icon}"></i>` : ''
@@ -278,7 +278,8 @@ Anot.component('input', {
     type: 'text',
     width: 180,
     placeholder: '',
-    default: ''
+    default: '',
+    submit: Anot.PropsTypes.isFunction() // on key `ENTER`
   },
   methods: {
     onFocus() {
@@ -286,6 +287,13 @@ Anot.component('input', {
     },
     onBlur() {
       this.active = false
+    },
+    onKeyup(ev) {
+      if (ev.keyCode === 13) {
+        if (typeof this.props.submit === 'function') {
+          this.props.submit()
+        }
+      }
     }
   }
 })
diff --git a/src/js/form/style.scss b/src/js/form/style.scss
index c304b6f..7df95b8 100644
--- a/src/js/form/style.scss
+++ b/src/js/form/style.scss
@@ -37,17 +37,17 @@
   }
 
   
-  &.teal {color:nth($ct, 1);}
-  &.green {color:nth($cg, 1);}
-  &.blue {color:nth($cb, 1);}
-  &.purple {color:nth($cpp, 1);}
-  &.red {color:nth($cr, 1);}
-  &.orange {color:nth($co, 1);}
+  &.teal {color:nth($ct, 2);}
+  &.green {color:nth($cg, 2);}
+  &.blue {color:nth($cb, 2);}
+  &.purple {color:nth($cpp, 2);}
+  &.red {color:nth($cr, 2);}
+  &.orange {color:nth($co, 2);}
   &.plain {color:nth($cp, 3);}
-  &.grey {color:nth($cgr, 1);}
-  &.dark {color:nth($cd, 1);}
+  &.grey {color:nth($cgr, 2);}
+  &.dark {color:nth($cd, 2);}
 
-  &.disabled {color:nth($cp, 1);cursor:not-allowed;
+  &.disabled {color:nth($cp, 2);cursor:not-allowed;
     
     &::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;
 
 
-  &__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:""}  
 
-  &.teal &__box  {border-color:nth($ct, 1);
-    &::after {background:nth($ct, 1);}
+  &.teal &__box  {border-color:nth($ct, 2);
+    &::after {background:nth($ct, 2);}
   }
-  &.teal {color:nth($ct, 1);}
+  &.teal {color:nth($ct, 2);}
 
-  &.green &__box  {border-color:nth($cg, 1);
-    &::after {background:nth($cg, 1);}
+  &.green &__box  {border-color:nth($cg, 2);
+    &::after {background:nth($cg, 2);}
   }
-  &.green {color:nth($cg, 1);}
+  &.green {color:nth($cg, 2);}
 
-  &.blue &__box {border-color:nth($cb, 1);
-    &::after {background:nth($cb, 1);}
+  &.blue &__box {border-color:nth($cb, 2);
+    &::after {background:nth($cb, 2);}
   }
-  &.blue {color:nth($cb, 1);}
+  &.blue {color:nth($cb, 2);}
 
-  &.purple &__box {border-color:nth($cpp, 1);
-    &::after {background:nth($cpp, 1);}
+  &.purple &__box {border-color:nth($cpp, 2);
+    &::after {background:nth($cpp, 2);}
   }
-  &.purple {color:nth($cpp, 1);}
+  &.purple {color:nth($cpp, 2);}
 
-  &.red &__box  {border-color:nth($cr, 1);
-    &::after {background:nth($cr, 1);}
+  &.red &__box  {border-color:nth($cr, 2);
+    &::after {background:nth($cr, 2);}
   }
-  &.red {color:nth($cr, 1);}
+  &.red {color:nth($cr, 2);}
 
-  &.orange &__box  {border-color:nth($co, 1);
-    &::after {background:nth($co, 1);}
+  &.orange &__box  {border-color:nth($co, 2);
+    &::after {background:nth($co, 2);}
   }
-  &.orange {color:nth($co, 1);}
+  &.orange {color:nth($co, 2);}
 
   &.plain &__box  {border-color:nth($cp, 3);
     &::after {background:nth($cp, 3);}
   }
   &.plain {color:nth($cp, 3);}
 
-  &.grey &__box  {border-color:nth($cgr, 1);
-    &::after {background:nth($cgr, 1);}
+  &.grey &__box  {border-color:nth($cgr, 2);
+    &::after {background:nth($cgr, 2);}
   }
-  &.grey {color:nth($cgr, 1);}
+  &.grey {color:nth($cgr, 2);}
 
-  &.dark &__box  {border-color:nth($cd, 1);
-    &::after {background:nth($cd, 1);}
+  &.dark &__box  {border-color:nth($cd, 2);
+    &::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.checked {color:nth($cd, 2);}
+  &.disabled.checked {color:nth($cd, 1);}
   &.disabled &__box {border-color:nth($cp, 3);
     &::after {background:nth($cp, 3);}
   }
@@ -127,35 +127,35 @@
 
   &.checked &__dot {left:auto;right:0;}
 
-  &.teal.checked &__dot  {background:nth($ct, 1);}
-  &.teal.checked &__label  {background:nth($ct, 2) + a0;}
+  &.teal.checked &__dot  {background:nth($ct, 2);}
+  &.teal.checked &__label  {background:nth($ct, 1) + a0;}
 
-  &.green.checked &__dot  {background:nth($cg, 1);}
-  &.green.checked &__label  {background:nth($cg, 2) + a0;}
+  &.green.checked &__dot  {background:nth($cg, 2);}
+  &.green.checked &__label  {background:nth($cg, 1) + a0;}
 
-  &.blue.checked &__dot {background:nth($cb, 1);}
-  &.blue.checked &__label {background:nth($cb, 2) + a0;}
+  &.blue.checked &__dot {background:nth($cb, 2);}
+  &.blue.checked &__label {background:nth($cb, 1) + a0;}
 
-  &.purple.checked &__dot {background:nth($cpp, 1);}
-  &.purple.checked &__label {background:nth($cpp, 2) + a0;}
+  &.purple.checked &__dot {background:nth($cpp, 2);}
+  &.purple.checked &__label {background:nth($cpp, 1) + a0;}
 
-  &.red.checked &__dot  {background:nth($cr, 1);}
-  &.red.checked &__label  {background:nth($cr, 2) + a0;}
+  &.red.checked &__dot  {background:nth($cr, 2);}
+  &.red.checked &__label  {background:nth($cr, 1) + a0;}
 
-  &.orange.checked &__dot  {background:nth($co, 1);}
-  &.orange.checked &__label  {background:nth($co, 2) + a0;}
+  &.orange.checked &__dot  {background:nth($co, 2);}
+  &.orange.checked &__label  {background:nth($co, 1) + a0;}
 
   &.plain.checked &__dot  {background:nth($cp, 3);}
   &.plain.checked &__label  {background:nth($cp, 2);}
 
-  &.grey.checked &__dot  {background:nth($cgr, 1);}
-  &.grey.checked &__label  {background:nth($cgr, 2) + a0;}
+  &.grey.checked &__dot  {background:nth($cgr, 2);}
+  &.grey.checked &__label  {background:nth($cgr, 1) + a0;}
 
-  &.dark.checked &__dot  {background:nth($cd, 1);}
-  &.dark.checked &__label  {background:nth($cd, 2) + a0;}
+  &.dark.checked &__dot  {background:nth($cd, 2);}
+  &.dark.checked &__label  {background:nth($cd, 1) + a0;}
 
   &.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:"";}
   }
@@ -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;
 
 
-  &__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;}
 
-  &.grey {color:nth($cgr, 1);}
-  &.grey &__box {border-color:nth($cgr, 1);}
-  &.grey.checked &__box {background:nth($cgr, 1);}
+  &.grey {color:nth($cgr, 2);}
+  &.grey &__box {border-color:nth($cgr, 2);}
+  &.grey.checked &__box {background:nth($cgr, 2);}
 
-  &.dark {color:nth($cd, 1);}
-  &.dark &__box {border-color:nth($cd, 1);}
-  &.dark.checked &__box {background:nth($cd, 1);}
+  &.dark {color:nth($cd, 2);}
+  &.dark &__box {border-color:nth($cd, 2);}
+  &.dark.checked &__box {background:nth($cd, 2);}
 
-  &.teal {color:nth($ct, 1);}
-  &.teal &__box {border-color:nth($ct, 1);}
-  &.teal.checked &__box {background:nth($ct, 1);}
+  &.teal {color:nth($ct, 2);}
+  &.teal &__box {border-color:nth($ct, 2);}
+  &.teal.checked &__box {background:nth($ct, 2);}
 
-  &.green {color:nth($cg, 1);}
-  &.green &__box {border-color:nth($cg, 1);}
-  &.green.checked &__box {background:nth($cg, 1);}
+  &.green {color:nth($cg, 2);}
+  &.green &__box {border-color:nth($cg, 2);}
+  &.green.checked &__box {background:nth($cg, 2);}
 
-  &.blue {color:nth($cb, 1);}
-  &.blue &__box {border-color:nth($cb, 1);}
-  &.blue.checked &__box {background:nth($cb, 1);}
+  &.blue {color:nth($cb, 2);}
+  &.blue &__box {border-color:nth($cb, 2);}
+  &.blue.checked &__box {background:nth($cb, 2);}
 
-  &.purple {color:nth($cpp, 1);}
-  &.purple &__box {border-color:nth($cpp, 1);}
-  &.purple.checked &__box {background:nth($cpp, 1);}
+  &.purple {color:nth($cpp, 2);}
+  &.purple &__box {border-color:nth($cpp, 2);}
+  &.purple.checked &__box {background:nth($cpp, 2);}
 
-  &.orange {color:nth($co, 1);}
-  &.orange &__box {border-color:nth($co, 1);}
-  &.orange.checked &__box {background:nth($co, 1);}
+  &.orange {color:nth($co, 2);}
+  &.orange &__box {border-color:nth($co, 2);}
+  &.orange.checked &__box {background:nth($co, 2);}
 
   &.plain {color:nth($cp, 3);}
   &.plain &__box {border-color:nth($cp, 3);}
   &.plain.checked &__box {background:nth($cp, 3);}
 
-  &.red {color:nth($cr, 1);}
-  &.red &__box {border-color:nth($cr, 1);}
-  &.red.checked &__box {background:nth($cr, 1);}
+  &.red {color:nth($cr, 2);}
+  &.red &__box {border-color:nth($cr, 2);}
+  &.red.checked &__box {background:nth($cr, 2);}
     
   &.disabled {cursor:not-allowed;color:nth($cp, 3);text-decoration:line-through;}
   &.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);}
 
 }
 
 
 
-.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-right {padding-right:30px;}
@@ -226,7 +226,7 @@
 
     &.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;}
 
   &::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-right &__holder {padding-right:30px;}
 
-  &.grey {color:nth($cgr, 1);
-    &::after {background:nth($cgr, 2);}
+  &.grey {color:nth($cgr, 2);
+    &::after {background:nth($cgr, 1);}
   }
 
-  &.dark {color:nth($cd, 1);
-    &::after {background:nth($cd, 2);}
+  &.dark {color:nth($cd, 2);
+    &::after {background:nth($cd, 1);}
   }
 
-  &.teal{color:nth($ct, 1);
-    &::after {background:nth($ct, 2);}
+  &.teal{color:nth($ct, 2);
+    &::after {background:nth($ct, 1);}
   }
 
-  &.green {color:nth($cg, 1);
-    &::after {background:nth($cg, 2);}
+  &.green {color:nth($cg, 2);
+    &::after {background:nth($cg, 1);}
   }
 
-  &.red {color:nth($cr, 1);
-    &::after {background:nth($cr, 2);}
+  &.red {color:nth($cr, 2);
+    &::after {background:nth($cr, 1);}
   }
 
-  &.blue {color:nth($cb, 1);
-    &::after {background:nth($cb, 2);}
+  &.blue {color:nth($cb, 2);
+    &::after {background:nth($cb, 1);}
   }
 
-  &.purple {color:nth($cpp, 1);
-    &::after {background:nth($cpp, 2);}
+  &.purple {color:nth($cpp, 2);
+    &::after {background:nth($cpp, 1);}
   }
 
-  &.orange {color:nth($co, 1);
-    &::after {background:nth($co, 2);}
+  &.orange {color:nth($co, 2);
+    &::after {background:nth($co, 1);}
   }
 
   &.disabled {background:#fff8ed;color:nth($cp, 3);}
diff --git a/src/js/layer/skin/normal.scss b/src/js/layer/skin/normal.scss
index 4fdb2a7..45db97d 100644
--- a/src/js/layer/skin/normal.scss
+++ b/src/js/layer/skin/normal.scss
@@ -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;
@@ -45,8 +45,8 @@
           
         .prompt-value {width: 100%;height: 30px;padding: 0 8px;border: 1px solid #ddd;border-radius: 3px;
 
-            &.alert {border-color:nth($cr, 1)}
-            &:focus {border-color:nth($ct, 1)}
+            &.alert {border-color:nth($cr, 2)}
+            &:focus {border-color:nth($ct, 2)}
         }
         .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;
 
-        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 {
             &::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;
 
-        &.style-info {border:1px solid nth($ct, 1);background:#edfbf8;color:nth($ct, 3);}
-        &.style-warn {border:1px solid nth($co, 1);background:#fffbed;color:nth($co, 3);}
-        &.style-deny {border:1px solid nth($cr, 1);background:#fffbed;color:nth($cr, 3);}
+        &.style-info {border:1px solid nth($ct, 2);background:#edfbf8;color:nth($ct, 3);}
+        &.style-warn {border:1px solid nth($co, 2);background:#fffbed;color:nth($co, 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;}
       }
diff --git a/src/js/marked/theme.scss b/src/js/marked/theme.scss
index 51ccea8..76ee6f3 100644
--- a/src/js/marked/theme.scss
+++ b/src/js/marked/theme.scss
@@ -28,17 +28,17 @@
   h6:before {display:block;position:absolute;left:0;top:50%;width:100%;content:" ";border-bottom:1px solid #ddd;}
 
   a {text-decoration:underline;}
-  a:hover {color:nth($co, 1)}
+  a:hover {color:nth($co, 2)}
   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;}
   /* 提醒文本 */
-  .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;}
-    &::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";}
   }
diff --git a/src/js/meditor/addon/attach.scss b/src/js/meditor/addon/attach.scss
index afc7083..c52821d 100644
--- a/src/js/meditor/addon/attach.scss
+++ b/src/js/meditor/addon/attach.scss
@@ -7,15 +7,15 @@
  */
 @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:hover {background:nth($cp, 1);}
+  ::-webkit-scrollbar {width:5px;height:5px;background:nth($cp, 1);}
+  ::-webkit-scrollbar:hover {background:nth($cp, 2);}
   ::-webkit-scrollbar-button {display:none;}
-  ::-webkit-scrollbar-thumb {background:nth($cgr, 2);}
-  ::-webkit-scrollbar-thumb:hover {background:nth($cgr, 1);}
+  ::-webkit-scrollbar-thumb {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;
 
@@ -34,16 +34,16 @@
 
     .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;}
     }
 
 
     .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);}
       }
       .tips  {display:inline-block;padding:0 10px;}
@@ -51,7 +51,7 @@
  
     .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;}
 
       .col {float:left;height:30px;padding:0 5px;}
@@ -63,14 +63,14 @@
         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;}
     }
 
     .manager {overflow:hidden;overflow-y:auto;width:100%;height:300px;
 
       .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)}
 
diff --git a/src/js/meditor/skin/main.scss b/src/js/meditor/skin/main.scss
index 52cb25b..7dd87c9 100644
--- a/src/js/meditor/skin/main.scss
+++ b/src/js/meditor/skin/main.scss
@@ -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);
 
-  ::-webkit-scrollbar {width:5px;height:5px;background:nth($cp, 2);}
-  ::-webkit-scrollbar:hover {background:nth($cp, 1);}
+  ::-webkit-scrollbar {width:5px;height:5px;background:nth($cp, 1);}
+  ::-webkit-scrollbar:hover {background:nth($cp, 2);}
   ::-webkit-scrollbar-button {display:none;}
-  ::-webkit-scrollbar-thumb {background:nth($cgr, 2);}
-  ::-webkit-scrollbar-thumb:hover {background:nth($cgr, 1);}
+  ::-webkit-scrollbar-thumb {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);}
   }
 
-  .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;
 
@@ -79,21 +79,21 @@
 
 
 
-.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 {
     &::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;
-    pre {width:100%;padding-bottom:15px;line-height:1;font-size:14px;}
-    a {color:#049789}
-    p {margin:0 auto 5px;}
+  pre {width:100%;padding-bottom:15px;line-height:1;font-size:14px;}
+  a {color:nth($ct, 1)}
+  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;
 
-    .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%;}
     .submit {float:right;width:30%;}
   }
@@ -139,15 +139,15 @@
   section {display:block;width:100%;height:auto;margin:10px 0;line-height:35px;
   
     .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;}
 
-      &: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;}
   }
diff --git a/src/js/pager/main.scss b/src/js/pager/main.scss
index 3eb6912..982a0d5 100644
--- a/src/js/pager/main.scss
+++ b/src/js/pager/main.scss
@@ -8,7 +8,7 @@
 
 @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;
     .button,.page {min-width:30px;height:30px}
@@ -20,7 +20,7 @@
     .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;}
   .curr, .disabled {cursor:default;}
   
@@ -32,10 +32,10 @@
     .curr {padding:0 8px;margin:0 3px;}
     
     .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;}
     }
-    .page.curr {background:none;color:nth($cgr, 1);
+    .page.curr {background:none;color:nth($cgr, 2);
       &:hover,&:active {background:none;}
     }
     .button[disabled] {cursor:not-allowed;}
@@ -59,92 +59,92 @@
   }
 
   &.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)}
     }
-    .button[disabled] {background:nth($cp, 1);}
+    .button[disabled] {background:nth($cp, 2);}
     &.skin-2 .curr {background:nth($cp, 3)}
   }
 
   &.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)}
     }
-    .button[disabled] {background:nth($cgr, 1);}
+    .button[disabled] {background:nth($cgr, 2);}
     &.skin-2 .curr {background:nth($cgr, 3)}
   }
 
   &.dark {
-    .page,.button {background:nth($cd, 1);color: #fff;
+    .page,.button {background:nth($cd, 2);color: #fff;
 
       &:hover {background:nth($cd, 2)}
       &:active {background:nth($cd, 3)}
     }
-    .button[disabled] {background:nth($cd, 1);}
+    .button[disabled] {background:nth($cd, 2);}
     &.skin-2 .curr {background:nth($cd, 3)}
   }
 
   &.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)}
     }
-    .button[disabled] {background:nth($cr, 1);}
+    .button[disabled] {background:nth($cr, 2);}
     &.skin-2 .curr {background:nth($cr, 3)}
   }
 
   &.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)}
     }
-    .button[disabled] {background:nth($co, 1);}
+    .button[disabled] {background:nth($co, 2);}
     &.skin-2 .curr {background:nth($co, 3)}
   }
 
   &.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)}
     }
-    .button[disabled] {background:nth($cg, 1);}
+    .button[disabled] {background:nth($cg, 2);}
     &.skin-2 .curr {background:nth($cg, 3)}
   }
 
   &.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)}
     }
-    .button[disabled] {background:nth($ct, 1);}
+    .button[disabled] {background:nth($ct, 2);}
     &.skin-2 .curr {background:nth($ct, 3)}
   }
 
   &.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)}
     }
-    .button[disabled] {background:nth($cb, 1);}
+    .button[disabled] {background:nth($cb, 2);}
     &.skin-2 .curr {background:nth($cb, 3)}
   }
 
   &.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)}
     }
-    .button[disabled] {background:nth($cpp, 1);}
+    .button[disabled] {background:nth($cpp, 2);}
     &.skin-2 .curr {background:nth($cpp, 3)}
   }  
 
diff --git a/src/js/prism/highlight.scss b/src/js/prism/highlight.scss
index f77b9bc..a211e4d 100644
--- a/src/js/prism/highlight.scss
+++ b/src/js/prism/highlight.scss
@@ -9,7 +9,7 @@
 @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;
@@ -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";}
\ No newline at end of file
+.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";}
\ No newline at end of file
diff --git a/src/js/tree/main.scss b/src/js/tree/main.scss
index 79a540c..91947a6 100644
--- a/src/js/tree/main.scss
+++ b/src/js/tree/main.scss
@@ -9,20 +9,20 @@
 @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;
  
     .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;}
 
     span {
 
-      &:hover {color:nth($cd, 2);}
+      &:hover {color:nth($cd, 1);}
       &.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;}