diff --git a/src/css/datepicker.scss b/src/css/datepicker.scss
deleted file mode 100644
index 39c351a..0000000
--- a/src/css/datepicker.scss
+++ /dev/null
@@ -1,106 +0,0 @@
-@charset "UTF-8";
-/** 
- * 
- * @authors yutent (yutent@doui.cc)
- * @date    2016-02-14 14:00:06
- * 
- */
-@import "var.scss";
-
-.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, 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, 2); @include ts();
-
-      &: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:fixed;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, 2);content:""}
-
-    dt.contrl {position:relative; width:100%; height:35px; margin:5px 0 0;border-radius:3px;color:#fff;
-
-      a { position:absolute; left:0; top:0; width:35px; height:35px;color:#fff;cursor:pointer;
-
-        &::after {position:absolute;left:0;top:0;z-index:-1;display:block;width:35px;height:35px;border-radius:50%;background:nth($ct, 3); content:"";opacity:0;transform: scale(0);}
-
-        &:active {font-weight:bold;
-          &::after {animation:ripple .3s cubic-bezier(0.23, 1, 0.32, 1);}
-        }
-
-        &.prev-month {left:35px;}
-        &.next-month {left:auto; right:35px;}
-        &.next-year {left:auto; right:0;}
-      }
-
-    }
-    dd.table { width:100%; height:auto;
-      .thead {width:100%; height:35px; margin-bottom:5px;color:#fff;}
-      span.td {position:relative;float:left; width:33px;margin:1px;border-radius:3px;
-
-      }
-
-      .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, 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);}
-        }
-
-        &.weeken {color:nth($ct, 3);}
-        &.selected {color:#fff;
-          &::before {background:nth($ct, 1);}
-        }
-        &.disabled { color:nth($cp, 2); cursor:default;
-          
-          &::before {display:none;}
-        }
-      }
-    }
-
-    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, 2); text-align:center; }
-      }
-      .now { float:right; width:50px; height:30px; border-radius:3px; background:nth($cp, 2);text-align:center;
-      }
-    }
-
-    dt.confirm { position:relative; width:100%; height:41px; padding:10px 0 0;line-height:30px; border-top:1px solid #eee; text-align:right;
-
-      .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, 2); color:#fff;
-        &:hover { background:nth($ct, 1); }
-        &:active { background:nth($ct, 3); }
-      }
-      .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, 2);border-radius:5px; font-size:12px; text-align:center; }
-  }
-}
-
-
-@keyframes ripple {
-  from {transform: scale(0);opacity:0;}
-  30% {opacity:.8;}
-  to {transform: scale(1.2); opacity:0;}
-} 
\ No newline at end of file
diff --git a/src/css/elem-ui.scss b/src/css/elem-ui.scss
deleted file mode 100644
index 1ddb5de..0000000
--- a/src/css/elem-ui.scss
+++ /dev/null
@@ -1,129 +0,0 @@
-@charset "UTF-8";
-/**
- * 
- * @authors yutent (yutent@doui.cc)
- * @date    2017-05-20 21:35:30
- * @version $Id$
- */
-
-@import "var.scss";
-
-
-/*--------各种按钮---------*/
-.do-ui-button {display:inline-block;height:16px;padding:2px 5px;line-height:12px;border:0;border-radius:2px;text-align:center;font-size:12px;background:nth($cp, 2);color:nth($cgr, 1);cursor:pointer;@include ts;
-
-  &.medium {min-width:80px;height:30px;padding:0 8px;line-height:30px;font-size:14px}
-  &.large {min-width:130px;height:45px;padding:0 13px;line-height:45px;border-radius:3px;font-size:18px;}
-
-  &:hover {background:nth($cp, 1);}
-  &:active {background:nth($cp, 3);}
-  
-  &.teal {background:nth($ct, 2);color:#fff;}
-  &.teal:hover {background:nth($ct, 1);}
-  &.teal:active {background:nth($ct, 3);}
-  &.green {background:nth($cg, 2);color:#fff;}
-  &.green:hover {background:nth($cg, 1);}
-  &.green:active {background:nth($cg, 3);}
-  &.blue {background:nth($cb, 2);color:#fff;}
-  &.blue:hover {background:nth($cb, 1);}
-  &.blue:active {background:nth($cb, 3);}
-  &.purple {background:nth($cpp, 2);color:#fff;}
-  &.purple:hover {background:nth($cpp, 1);}
-  &.purple:active {background:nth($cpp, 3);}
-  &.red {background:nth($cr, 2);color:#fff;}
-  &.red:hover {background:nth($cr, 1);}
-  &.red:active {background:nth($cr, 3);}
-  &.orange {background:nth($co, 2);color:#fff;}
-  &.orange:hover {background:nth($co, 1);}
-  &.orange:active {background:nth($co, 3);}
-  &.grey {background:nth($cgr, 2);color:#fff;}
-  &.grey:hover {background:nth($cgr, 1);}
-  &.grey:active {background:nth($cgr, 3);}
-  &.dark {background:nth($cd, 2);color:#fff;}
-  &.dark:hover {background:nth($cd, 1);}
-  &.dark:active {background:nth($cd, 3);}
-
-  &.disabled {background:nth($cp, 1);color:nth($cp, 3);cursor:not-allowed;}
-  
-}
-
-
-
-
-/*--------各种input---------*/
-
-
-.do-ui-input {width:auto;height:30px;padding:0 5px;background:nth($cp, 1);border:2px solid transparent;border-radius:5px;font-size:13px;@include ts();color: nth($cd, 2);
-
-  &:focus {background:#fff;border-color:nth($cd, 2);}
-    
-  &::placeholder {color:nth($cgr, 1);}
-  &:disabled {border-color:transparent;background:#fff8ed;color:nth($cgr, 1);cursor:not-allowed;}
-
-}
-
-.do-ui-textarea {width:auto;height:120px;padding:5px 8px;background:nth($cp, 1);border:2px solid transparent;border-radius:5px;font-size:14px;@include ts();color: nth($cd, 2);
-
-  &:focus {background:#fff;border-color:nth($cd, 2);}
-    
-  &:disabled {border-color:transparent;background:#fff8ed;color:nth($cgr, 1);cursor:not-allowed;}
-}
-
-
-/* select框 */
-.do-ui-select  {position:relative;display:inline-block;width:auto;min-width:100px;height:30px;color:nth($cgr, 1);
-
-  select {width:100%;height:100%;padding:5px 13px;line-height:1;background:nth($cp, 1);border-radius:5px;appearance:none;border:2px solid transparent;outline:none;color: nth($cd, 2);font-size:13px;
-
-    &:focus {background:#fff;border-color:nth($cd, 2);}
-    &::-ms-expand {display:none;}
-    &:disabled {border-color:transparent;background:#fff8ed;color:nth($cp, 3)}
-  }
-  .trigon {position:absolute;right:7px;top:0;width:15px;height:30px;padding:7px 0;font-size:12px;text-align:center;
-    i {float:left;width:15px;height:12px;line-height:12px;}
-    i:nth-child(2) {margin-top:-6px;}
-  }
-}
-
-/* 单选和复选框 */
-.do-ui-radio,
-.do-ui-checkbox {display:inline-block;position:relative;width:auto;height:auto;padding:0 5px 0 35px;line-height:30px;color:nth($cd, 1);font-size:13px;
-
-  >input {position:absolute;left:7px;top:5px;width:20px;height:20px;border-radius:50%;border:1px solid nth($cp, 3);background:#fff;appearance:none;
-
-    &:checked {box-shadow:0 0 5px nth($cb, 1);}
-    &:checked::after {display:block;width:12px;height:12px;margin:3px;border-radius:50%;background:nth($cgr, 1);content:""}
-
-    &:disabled {background:#fff8ed;box-shadow:none;cursor:not-allowed;}
-    &:disabled:checked::after {background:nth($cgr, 1);}
-  }
-
-  &.disabled {color:nth($cp, 3);cursor:not-allowed;}
-}
-
-.do-ui-checkbox {
-
-  >input {border-radius:3px;
-
-    &:checked::after {width:100%;height:100%;margin:0;line-height:18px;font-size:18px;text-align:center;color:nth($cgr, 1);background:none;content:"✓"}
-
-    &:disabled:checked::after {color:nth($cgr, 1);background:none;}
-  }
-
-}
-
-
-
-/* 引用文本 */
-.do-ui-quote {display:inline-block;position:relative;min-height:60px;margin:10px 0;padding:15px 10px 5px 50px;border:1px solid nth($cp, 3);border-radius:10px;background:nth($cp, 1);color:nth($cgr, 1);font-size:14px;word-break: break-all;
-
-  i {position:absolute;left:8px;top:0;font-size:30px;line-height:1.5;color:nth($cp, 3);}
-}
-
-/* 提醒文本 */
-.do-ui-warn,.do-ui-mark {display:inline-block;position:relative;min-height:40px;margin:5px 0;padding:5px 8px 5px 30px;border:1px solid nth($co, 1);border-radius:5px;background:#fffbed;color:nth($co, 3);font-size:14px;word-break: break-all;
-    
-  p {margin:0!important;}
-  i {position:absolute;left:5px;top:2px;font-size:20px;line-height:1.5;}
-}
-.do-ui-mark {border-color:nth($ct, 2);color:nth($ct, 3);background:#edfbf8;}
\ No newline at end of file
diff --git a/src/css/form.scss b/src/css/form.scss
deleted file mode 100644
index c850b63..0000000
--- a/src/css/form.scss
+++ /dev/null
@@ -1,276 +0,0 @@
-@charset "UTF-8";
-/**
- * 
- * @authors yutent (yutent@doui.cc)
- * @date    2018-06-12 13:08:26
- * @version $Id$
- */
-
-@import "var.scss";
-
-
-.do-button {overflow:hidden;position:relative;display:inline-block;width:auto;height:30px;padding:0 10px;line-height:30px;text-align:center;cursor:pointer;font-size:14px;
-
-  &::before {position:absolute;left:-50%;top:-50%;display:block;width:200%;height:200%;border-radius:50%;background:rgba(220,220,220,.5); 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 {
-    &::before {background:rgba(0,0,0,.1);}
-  }
-
-  &__text,&__icon {position:relative;display:inline-block;}
-  &__icon {font-size:20px;vertical-align:top;}
-
-  &.small {height:20px;padding:0 5px;line-height:20px;font-size:12px;
-    
-    i {font-size:16px;}
-  }
-  &.medium {min-width:100px;height:35px;line-height:35px;font-size:16px;
-
-    i {padding-right:5px;font-size:24px;}
-  }
-  &.large {min-width:160px;height:50px;padding:0 13px;line-height:50px;font-size:18px;
-    
-    i {padding-right:10px;font-size:28px;}
-  }
-
-  
-  &.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, 2);}
-  &.dark {color:nth($cd, 2);}
-
-  &.disabled {color:nth($cp, 2);cursor:not-allowed;
-    
-    &::before {display:none;}
-  }
-}
-
-
-.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, 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, 2);
-    &::after {background:nth($ct, 2);}
-  }
-  &.teal {color:nth($ct, 2);}
-
-  &.green &__box  {border-color:nth($cg, 2);
-    &::after {background:nth($cg, 2);}
-  }
-  &.green {color:nth($cg, 2);}
-
-  &.blue &__box {border-color:nth($cb, 2);
-    &::after {background:nth($cb, 2);}
-  }
-  &.blue {color:nth($cb, 2);}
-
-  &.purple &__box {border-color:nth($cpp, 2);
-    &::after {background:nth($cpp, 2);}
-  }
-  &.purple {color:nth($cpp, 2);}
-
-  &.red &__box  {border-color:nth($cr, 2);
-    &::after {background:nth($cr, 2);}
-  }
-  &.red {color:nth($cr, 2);}
-
-  &.orange &__box  {border-color:nth($co, 2);
-    &::after {background:nth($co, 2);}
-  }
-  &.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, 2);
-    &::after {background:nth($cgr, 2);}
-  }
-  &.grey {color:nth($cgr, 2);}
-
-  &.dark &__box  {border-color:nth($cd, 2);
-    &::after {background:nth($cd, 2);}
-  }
-  &.dark {color:nth($cd, 2);}
-
-  
-  &.disabled {color:nth($cp, 3);cursor:not-allowed;text-decoration:line-through;}
-  &.disabled.checked {color:nth($cd, 1);}
-  &.disabled &__box {border-color:nth($cp, 3);
-    &::after {background:nth($cp, 3);}
-  }
-}
-
-
-
-.do-switch {position:relative;display:inline-block;width:45px;height:30px;padding-right:10px;cursor:default;
-
-  &__label {position:relative;display:inline-block;width:100%;height:14px;margin:7px 0;background:nth($cp, 3);border-radius:7px;}
-
-  &__dot {position:absolute;left:0;top:-3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);}
-
-  &:hover &__dot {transform:scale(1.1);}
-  &.disabled {cursor:not-allowed;}
-  &.disabled:hover &__dot {transform:scale(1);}
-
-  &.checked &__dot {left:auto;right:0;}
-
-  &.teal.checked &__dot  {background:nth($ct, 2);}
-  &.teal.checked &__label  {background:nth($ct, 1) + a0;}
-
-  &.green.checked &__dot  {background:nth($cg, 2);}
-  &.green.checked &__label  {background:nth($cg, 1) + a0;}
-
-  &.blue.checked &__dot {background:nth($cb, 2);}
-  &.blue.checked &__label {background:nth($cb, 1) + a0;}
-
-  &.purple.checked &__dot {background:nth($cpp, 2);}
-  &.purple.checked &__label {background:nth($cpp, 1) + a0;}
-
-  &.red.checked &__dot  {background:nth($cr, 2);}
-  &.red.checked &__label  {background:nth($cr, 1) + 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, 2);}
-  &.grey.checked &__label  {background:nth($cgr, 1) + 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 {
-
-    &::before {display:block;position:absolute;top:5px;width:8px;height:4px;border-radius:2px;background:#fff;content:"";}
-  }
-  &.disabled &__label::before {right:5px;}
-  &.disabled.checked &__label::before {left:5px;}
-}
-
-
-.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:18px;height:18px;margin:6px;margin-left:0;line-height:16px;border:1px solid nth($cgr, 2);border-radius:3px;font-size:16px;text-align:center;}
-  &.checked &__box {color:#fff;font-weight:bold;}
-
-  &.grey {color:nth($cgr, 2);}
-  &.grey &__box {border-color:nth($cgr, 2);}
-  &.grey.checked &__box {background:nth($cgr, 2);}
-
-  &.dark {color:nth($cd, 2);}
-  &.dark &__box {border-color:nth($cd, 2);}
-  &.dark.checked &__box {background:nth($cd, 2);}
-
-  &.teal {color:nth($ct, 2);}
-  &.teal &__box {border-color:nth($ct, 2);}
-  &.teal.checked &__box {background:nth($ct, 2);}
-
-  &.green {color:nth($cg, 2);}
-  &.green &__box {border-color:nth($cg, 2);}
-  &.green.checked &__box {background:nth($cg, 2);}
-
-  &.blue {color:nth($cb, 2);}
-  &.blue &__box {border-color:nth($cb, 2);}
-  &.blue.checked &__box {background:nth($cb, 2);}
-
-  &.purple {color:nth($cpp, 2);}
-  &.purple &__box {border-color:nth($cpp, 2);}
-  &.purple.checked &__box {background:nth($cpp, 2);}
-
-  &.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, 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, 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, 2);cursor:default;font-size:14px;
-
-  &.icon-left {padding-left:30px;}
-  &.icon-right {padding-right:30px;}
-
-  &__holder {visibility:hidden;position:absolute;bottom:0;left:0;width:100%;height:30px;padding:0 5px;color: nth($cp, 3);@include ts(bottom, .2s);
-
-    &.visible {visibility:visible;}
-  }
-  &__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;}
-
-  &.active &__holder {bottom:20px;}
-  &.active::after {left:0;width:100%;}
-
-  &.icon-left &__icon {left:0;}
-  &.icon-right &__icon {right:0;}
-
-  &.icon-left &__holder {padding-left:30px;}
-  &.icon-right &__holder {padding-right:30px;}
-
-  &.grey {color:nth($cgr, 2);
-    &::after {background:nth($cgr, 1);}
-  }
-
-  &.dark {color:nth($cd, 2);
-    &::after {background:nth($cd, 1);}
-  }
-
-  &.teal{color:nth($ct, 2);
-    &::after {background:nth($ct, 1);}
-  }
-
-  &.green {color:nth($cg, 2);
-    &::after {background:nth($cg, 1);}
-  }
-
-  &.red {color:nth($cr, 2);
-    &::after {background:nth($cr, 1);}
-  }
-
-  &.blue {color:nth($cb, 2);
-    &::after {background:nth($cb, 1);}
-  }
-
-  &.purple {color:nth($cpp, 2);
-    &::after {background:nth($cpp, 1);}
-  }
-
-  &.orange {color:nth($co, 2);
-    &::after {background:nth($co, 1);}
-  }
-
-  &.disabled {background:#fff8ed;color:nth($cp, 3);}
-  &.disabled &__input {cursor:not-allowed;color:nth($cp, 3);}
-
-}
\ No newline at end of file
diff --git a/src/css/layer-normal.scss b/src/css/layer-normal.scss
deleted file mode 100644
index 815f819..0000000
--- a/src/css/layer-normal.scss
+++ /dev/null
@@ -1,237 +0,0 @@
-@charset "UTF-8";
-/**
- * 
- * @authors yutent (yutent@doui.cc)
- * @date    2017-09-19 18:00:24
- * @version $Id$
- */
-
-@import "var.scss";
-
-
-.do-layer {display:flex;justify-content:center;align-items:center;width:auto;height:auto;
-
-  a {text-decoration:none;}
-
-  
-  .layer-box {flex:0 auto;position:absolute;z-index:65535;opacity:0;
-    
-    &.shift {transition: all .5s ease-out;}
-
-
-    
-
-    &.scale {transform:scale(1.02);transition:transform .1s linear;}
-
-    /* 默认皮肤 */
-    &.skin-normal {padding:15px 10px;border-radius:3px;color:#666;font-size:14px;box-shadow:0 5px 20px rgba(0,0,0,.3); 
-
-
-      /* 弹层标题栏 */
-      .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;word-break:break-all;word-wrap: break-word;
-          
-        .prompt-value {width: 100%;height: 30px;padding: 0 8px;border: 1px solid #ddd;border-radius: 3px;
-
-            &.alert {border-color:nth($cr, 2)}
-            &:focus {border-color:nth($ct, 2)}
-        }
-        .msg-box {line-height:30px;}
-      }
-
-
-      /* 弹层按钮部分 */
-      .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, 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, 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, 2)}
-        }
-      }
-
-    }
-
-    /* ;alert/confirm/prompt 3类弹层 */
-    &.type-1,
-    &.type-2,
-    &.type-3 {max-width:600px;min-width:300px;
-      
-      .layer-content {padding:10px;}
-    }
-
-
-    &.type-4 {padding:0;
-
-      .frame-box {display:block;width:100%;height:100%;margin:0;padding:0;border:0;resize: none;}
-    }
-
-    /* tips类弹层(type 5) */
-    &.type-5 {visibility:hidden;position:fixed;z-index:65534;min-width:75px;max-width:600px;padding:10px;line-height:1.5;color:#fff;background:rgba(0,0,0,.5);box-shadow:none;
-
-      i.arrow {position:absolute;width:0;height:0;border:6px solid transparent;content: ""}
-      i.offset-top {left:5px;bottom:-14px;border-top:8px solid rgba(0,0,0,.5);}
-      i.offset-bottom {left:5px;top:-14px;border-bottom:8px solid rgba(0,0,0,.5);}
-      i.offset-top-left {right:5px;bottom:-14px;border-top:8px solid rgba(0,0,0,.5);}
-      i.offset-bottom-left {right:5px;top:-14px;border-bottom:8px solid rgba(0,0,0,.5);}
-
-      .layer-content {min-height:20px;margin:0;}
-    }
-
-    
-    /* loading类弹层 */
-    &.type-6 {z-index:65539;box-shadow:none;background:transparent;
-    
-      .layer-content {display:flex;justify-content:center;align-items:center;}
-    }
-
-    
-    /* 特殊类弹层(toast弹层) */
-    &.type-toast {position:fixed;min-width:10px;padding:0;background:transparent;
-
-      .layer-content {min-height:40px;height:40px;}
-
-      .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, 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;}
-      }
-    }
-
-    
-    /* 内置几种loading动画 */
-    .loading {position:relative;width:100px;height:100px;margin:auto;
-
-      .dot-box {position:absolute;display:block;}
-      
-      /* 常规的转动 */
-      &.style-1 {
-
-        .dot-box {width:70%;height:70%;margin:15%;line-height:70px;font-size:70px;text-align:center;animation: circle .8s infinite linear;
-          
-          i {display:block;width:100%;height:100%;}
-        }
-      }
-  
-      
-      /* 频谱波动 */
-      &.style-2 {height:40px;
-
-        .dot-box{display:flex;justify-content:center;width:100%;height:100%;
-            
-          i {float:left;display:block;width:6px;height:100%;margin:0 3px;background:nth($ct, 3);animation: bounce 1s infinite ease-in-out;transform:scaleY(.6);
-
-            &:nth-child(2) {animation-delay:.1s;}
-            &:nth-child(3) {animation-delay:.2s;}
-            &:nth-child(4) {animation-delay:.3s;}
-            &:nth-child(5) {animation-delay:.4s;}
-          }
-        }
-      }
-
-      /* 缓动圆圈 */
-      &.style-3 {width:50px;height:50px;
-
-        .dot-box{width:100%;height:100%;
-          
-          i {position:absolute;display:block;width:100%;height:100%;animation: circle2 2s infinite ease-in-out;transform: rotate(45deg);opacity:.5;
-                  
-            &::before {display:block;width:8px;height:8px;background:nth($ct, 3);border-radius:50%;content:""}
-
-            &:nth-child(2) {animation-delay:.1s;}
-            &:nth-child(3) {animation-delay:.2s;}
-            &:nth-child(4) {animation-delay:.3s;}
-            &:nth-child(5) {animation-delay:.4s;}
-          }
-        }
-      }
-
-      /* 矩阵 */
-      &.style-4 {width:60px;height:60px;
-
-        .dot-box{
-            
-          i {float:left;display:block;width:20px;height:20px;background:nth($ct, 3);animation: grid 1.5s infinite linear;
-                  
-            &:nth-child(4),
-            &:nth-child(8) {animation-delay:.2s;}
-            &:nth-child(1),
-            &:nth-child(5),
-            &:nth-child(9) {animation-delay:.3s;}
-
-            &:nth-child(2),
-            &:nth-child(6) {animation-delay:.4s;}
-
-            &:nth-child(3) {animation-delay:.5s;}
-          }
-        }
-      }
-
-    }
-
-  }
-
-
-
-
-  &.mask {position:fixed;z-index:65534;left:0;top:0;width:100%;height:100%;background:transparent;backdrop-filter:blur(5px);
-
-    &.shift {transition: all .5s ease-out;}
-    &.inner {position:absolute;}
-  }
-  &:active {z-index:65536;}
-}
-
-
-/* 指令式的tips */
-.do-layer__tips {visibility:hidden;position:absolute;z-index:65534;min-width:75px;max-width:600px;padding:10px;line-height:1.5;border-radius:3px;font-size:14px;color:#fff;background:rgba(0,0,0,.5);
-
-  i.arrow {position:absolute;width:0;height:0;border:6px solid transparent;content: ""}
-  i.offset-top {left:5px;bottom:-14px;border-top:8px solid rgba(0,0,0,.5);}
-  i.offset-bottom {left:5px;top:-14px;border-bottom:8px solid rgba(0,0,0,.5);}
-  i.offset-top-left {right:5px;bottom:-14px;border-top:8px solid rgba(0,0,0,.5);}
-  i.offset-bottom-left {right:5px;top:-14px;border-bottom:8px solid rgba(0,0,0,.5);}
-
-  .layer-content {min-height:20px;margin:0;}
-}
-
-
-
-@keyframes circle {
-  to {transform: rotate(360deg)}
-}
-
-@keyframes circle2 {
-  70%,to {transform: rotate(405deg);opacity:1}
-}
-
-
-@keyframes bounce {
-  25% {transform: scaleY(1);}
-  50% {transform: scaleY(.6);}
-}
-
-
-@keyframes grid { 
-  36% {transform: scale(.1);opacity:.3}
-  60% {transform: scale(1);opacity:1}
-}
-
-
-
-@media screen and (max-width:480px) {
-  .do-layer {
-    .layer-box {
-      &.type-1,&.type-2,&.type-3,&.type-4,&.type-7 {width:90%;}
-    }
-  }
-}
\ No newline at end of file