From 97aa5e7839a5473693cfe9bbecdb2fab726f2417 Mon Sep 17 00:00:00 2001
From: Justineo <justice360@gmail.com>
Date: Wed, 15 Sep 2021 20:03:51 +0800
Subject: [PATCH] feat: show all styles in source code

---
 one/docs/demo/accordion/multiple.vue          |  7 ++--
 one/docs/demo/accordion/size.vue              |  7 ++--
 one/docs/demo/alert-box/title.vue             |  3 +-
 one/docs/demo/alert-box/type.vue              |  2 +-
 one/docs/demo/alert/type.vue                  |  2 +-
 one/docs/demo/anchor/offset.vue               |  9 +++-
 one/docs/demo/anchor/sticky.vue               |  6 ++-
 one/docs/demo/badge/dot.vue                   |  2 +-
 one/docs/demo/badge/number.vue                |  2 +-
 one/docs/demo/badge/text.vue                  |  2 +-
 one/docs/demo/breadcrumb/redirect.vue         |  2 +-
 one/docs/demo/breadcrumb/separator.vue        |  2 +-
 one/docs/demo/breadcrumb/size.vue             |  2 +-
 one/docs/demo/breadcrumb/style.vue            |  2 +-
 one/docs/demo/button-group/disabled.vue       |  2 +-
 one/docs/demo/button-group/items.vue          |  2 +-
 one/docs/demo/button-group/size.vue           |  2 +-
 one/docs/demo/button-group/style.vue          |  2 +-
 one/docs/demo/button/disabled.vue             |  2 +-
 one/docs/demo/button/loading.vue              |  2 +-
 one/docs/demo/button/size.vue                 |  2 +-
 one/docs/demo/button/style.vue                |  2 +-
 one/docs/demo/calendar/range-multiple.vue     |  2 +-
 one/docs/demo/carousel/effect.vue             |  2 +-
 one/docs/demo/carousel/indicator.vue          | 19 +++++----
 one/docs/demo/carousel/slides.vue             |  2 +-
 one/docs/demo/carousel/switch.vue             |  2 +-
 one/docs/demo/carousel/vertical.vue           |  2 +-
 one/docs/demo/cascader/multiple.vue           | 38 +++++++++++++----
 one/docs/demo/cascader/size.vue               |  9 ++--
 one/docs/demo/check-button-group/default.vue  |  2 +-
 .../demo/check-button-group/exclusive.vue     |  2 +-
 one/docs/demo/checkbox-group/default.vue      |  2 +-
 one/docs/demo/checkbox-group/exclusive.vue    |  2 +-
 one/docs/demo/checkbox/size.vue               | 10 +++--
 one/docs/demo/collapse/size.vue               |  7 ++--
 one/docs/demo/date-picker/default.vue         |  2 +-
 one/docs/demo/date-picker/range.vue           |  2 +-
 one/docs/demo/dialog/async.vue                |  2 +-
 one/docs/demo/dialog/custom.vue               |  2 +-
 one/docs/demo/dialog/draggable.vue            |  2 +-
 one/docs/demo/dialog/modal.vue                |  2 +-
 one/docs/demo/dialog/size.vue                 |  2 +-
 one/docs/demo/dialog/stack.vue                |  2 +-
 one/docs/demo/dialog/status.vue               | 19 ++++++---
 one/docs/demo/directives/drag/axis.vue        | 14 +++----
 one/docs/demo/directives/drag/base.vue        |  6 +--
 one/docs/demo/directives/drag/containment.vue | 14 +++----
 one/docs/demo/directives/drag/targets.vue     | 14 +++----
 one/docs/demo/directives/nudge.vue            | 11 +++--
 one/docs/demo/directives/outside/click.vue    |  9 ++--
 .../directives/outside/hover-with-delay.vue   |  9 ++--
 one/docs/demo/directives/outside/hover.vue    |  9 ++--
 one/docs/demo/directives/resize.vue           |  2 +-
 one/docs/demo/directives/tooltip.vue          |  2 +-
 one/docs/demo/drawer/custom.vue               |  2 +-
 one/docs/demo/drawer/modal.vue                |  2 +-
 one/docs/demo/dropdown/disable.vue            |  2 +-
 one/docs/demo/dropdown/other.vue              |  3 +-
 one/docs/demo/dropdown/searchable.vue         |  2 +-
 one/docs/demo/dropdown/size.vue               |  2 +-
 one/docs/demo/dropdown/style.vue              |  2 +-
 one/docs/demo/embedded/size.vue               |  2 +-
 one/docs/demo/filter-panel/default.vue        |  2 +-
 one/docs/demo/focus-visible.vue               | 42 +++++++++----------
 one/docs/demo/form/disabled.vue               |  2 +-
 one/docs/demo/form/readonly.vue               |  2 +-
 one/docs/demo/grid/default.vue                |  2 -
 one/docs/demo/grid/fixed.vue                  |  2 -
 one/docs/demo/icon/default.vue                |  6 +--
 one/docs/demo/input-group/default.vue         |  2 +-
 one/docs/demo/input/disabled.vue              |  2 +-
 one/docs/demo/input/readonly.vue              |  2 +-
 one/docs/demo/input/size.vue                  |  2 +-
 one/docs/demo/label/default.vue               |  2 +-
 one/docs/demo/lightbox/default.vue            | 19 ++++++---
 one/docs/demo/link/default.vue                |  2 +-
 one/docs/demo/loading/layout.vue              |  2 +-
 one/docs/demo/loading/size.vue                |  4 +-
 one/docs/demo/loading/slot.vue                |  2 +-
 one/docs/demo/loading/style.vue               |  3 +-
 one/docs/demo/number-input/disabled.vue       |  2 +-
 one/docs/demo/number-input/readonly.vue       |  2 +-
 one/docs/demo/number-input/size.vue           |  2 +-
 one/docs/demo/overlay/position.vue            |  8 +---
 one/docs/demo/overlay/relative-base.vue       | 19 ++++++++-
 one/docs/demo/overlay/relative.less           | 18 --------
 .../stack-display-order-with-on-overlay.vue   | 17 +++++---
 one/docs/demo/overlay/stack-display-order.vue | 17 +++++---
 one/docs/demo/overlay/stack-on-overlay.vue    | 21 +++++++---
 one/docs/demo/pagination/goto.vue             |  2 +-
 one/docs/demo/pagination/size.vue             |  2 +-
 one/docs/demo/popover/position.vue            |  2 +-
 one/docs/demo/popover/trigger.vue             |  2 +-
 one/docs/demo/popover/ui.vue                  |  2 +-
 one/docs/demo/progress/default.vue            |  2 +-
 one/docs/demo/radio-button-group/default.vue  |  2 +-
 one/docs/demo/radio-group/default.vue         |  2 +-
 one/docs/demo/radio/model.vue                 |  2 +-
 one/docs/demo/radio/size.vue                  |  2 +-
 one/docs/demo/region-picker/default.vue       |  2 +-
 one/docs/demo/search-box/disabled.vue         |  2 +-
 one/docs/demo/search-box/size.vue             |  2 +-
 one/docs/demo/search-box/style.vue            |  2 +-
 one/docs/demo/select/inline.vue               |  2 +-
 one/docs/demo/select/multiple.vue             |  2 +-
 one/docs/demo/select/size.vue                 |  2 +-
 one/docs/demo/slider/variant.vue              |  2 -
 one/docs/demo/steps/default.vue               |  2 +-
 one/docs/demo/steps/status.vue                |  2 +-
 one/docs/demo/switch/size.vue                 |  2 +-
 one/docs/demo/table/basic.vue                 |  2 +-
 one/docs/demo/table/desc.vue                  |  6 ++-
 one/docs/demo/table/filter.vue                |  2 -
 one/docs/demo/table/fixed.vue                 |  2 +-
 one/docs/demo/tabs/style.vue                  |  2 +-
 one/docs/demo/tag/removable.vue               |  2 -
 one/docs/demo/tag/selectable.vue              |  2 -
 one/docs/demo/tag/size.vue                    |  2 -
 one/docs/demo/textarea/disabled.vue           |  2 +-
 one/docs/demo/textarea/readonly.vue           |  2 +-
 one/docs/demo/time-picker/mode.vue            |  2 +-
 one/docs/demo/toast/default.vue               |  2 +-
 one/docs/demo/toast/plugin.vue                |  2 +-
 one/docs/demo/tooltip/position.vue            |  2 +-
 one/docs/demo/tooltip/style.vue               |  2 +-
 one/docs/demo/tooltip/trigger.vue             |  2 +-
 one/docs/demo/transfer/size.vue               |  8 ++--
 one/docs/demo/tree/custom-item.vue            |  9 +---
 one/docs/demo/tree/default.vue                | 11 +++--
 one/docs/demo/tree/size.vue                   | 11 +++--
 one/docs/demo/ui.vue                          |  4 +-
 one/docs/demo/uploader/file.vue               | 11 +++--
 one/docs/directives/v-drag.md                 |  2 +-
 134 files changed, 349 insertions(+), 300 deletions(-)
 delete mode 100644 one/docs/demo/overlay/relative.less

diff --git a/one/docs/demo/accordion/multiple.vue b/one/docs/demo/accordion/multiple.vue
index 59872f1..4ad4506 100644
--- a/one/docs/demo/accordion/multiple.vue
+++ b/one/docs/demo/accordion/multiple.vue
@@ -22,7 +22,8 @@ export default {
 }
 </script>
 
-<style lang="stylus" scoped docs>
-section
-  margin-bottom 20px
+<style scoped>
+section {
+  margin-bottom: 20px;
+}
 </style>
diff --git a/one/docs/demo/accordion/size.vue b/one/docs/demo/accordion/size.vue
index af62060..bc6d3f3 100644
--- a/one/docs/demo/accordion/size.vue
+++ b/one/docs/demo/accordion/size.vue
@@ -34,7 +34,8 @@ export default {
 }
 </script>
 
-<style lang="stylus" scoped docs>
-section
-  margin-bottom 20px
+<style scoped>
+section {
+  margin-bottom: 20px;
+}
 </style>
diff --git a/one/docs/demo/alert-box/title.vue b/one/docs/demo/alert-box/title.vue
index dc2c51c..d10aabf 100644
--- a/one/docs/demo/alert-box/title.vue
+++ b/one/docs/demo/alert-box/title.vue
@@ -55,10 +55,11 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button {
   margin-right: 10px;
 }
+
 .icon {
   vertical-align: -2px;
 }
diff --git a/one/docs/demo/alert-box/type.vue b/one/docs/demo/alert-box/type.vue
index 6361af9..385dc88 100644
--- a/one/docs/demo/alert-box/type.vue
+++ b/one/docs/demo/alert-box/type.vue
@@ -60,7 +60,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button {
   margin-right: 10px;
 }
diff --git a/one/docs/demo/alert/type.vue b/one/docs/demo/alert/type.vue
index 0953396..46ff132 100644
--- a/one/docs/demo/alert/type.vue
+++ b/one/docs/demo/alert/type.vue
@@ -26,7 +26,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-alert {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/anchor/offset.vue b/one/docs/demo/anchor/offset.vue
index 3785027..3ee9c86 100644
--- a/one/docs/demo/anchor/offset.vue
+++ b/one/docs/demo/anchor/offset.vue
@@ -71,7 +71,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .anchor-offset-demo {
   position: relative;
 
@@ -80,7 +80,8 @@ export default {
     position: absolute;
     top: 20px;
     width: 180px;
-    border-top: 1px solid red;;
+    border-top: 1px solid red;
+
     &::after {
       content: "targetOffset: 20px";
       position: absolute;
@@ -90,9 +91,11 @@ export default {
       font-size: 12px;
     }
   }
+
   .sticky-offset-line {
     top: 30px;
     left: 250px;
+
     &::after {
       content: "stickyOffset: 30px";
     }
@@ -117,10 +120,12 @@ export default {
     width: 100px;
     height: 150px;
     flex: none;
+
     & + .block {
       margin-top: 20px;
     }
   }
+
   .anchor-two {
     position: absolute;
     left: 250px;
diff --git a/one/docs/demo/anchor/sticky.vue b/one/docs/demo/anchor/sticky.vue
index c08d13b..ee7bd80 100644
--- a/one/docs/demo/anchor/sticky.vue
+++ b/one/docs/demo/anchor/sticky.vue
@@ -77,14 +77,16 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .anchor-demo {
   position: relative;
+
   .line {
     position: absolute;
     top: 0;
     width: 180px;
     border-top: 1px solid red;;
+
     &::after {
       content: "0";
       position: absolute;
@@ -114,6 +116,7 @@ export default {
     width: 100px;
     height: 150px;
     flex: none;
+
     & + .block {
       margin-top: 20px;
     }
@@ -124,6 +127,7 @@ export default {
     left: 250px;
     top: 50px;
   }
+
   .anchor-two {
     position: absolute;
     left: 450px;
diff --git a/one/docs/demo/badge/dot.vue b/one/docs/demo/badge/dot.vue
index 883ed43..f4ad524 100644
--- a/one/docs/demo/badge/dot.vue
+++ b/one/docs/demo/badge/dot.vue
@@ -32,7 +32,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 1em;
 }
diff --git a/one/docs/demo/badge/number.vue b/one/docs/demo/badge/number.vue
index 049b41a..72fc703 100644
--- a/one/docs/demo/badge/number.vue
+++ b/one/docs/demo/badge/number.vue
@@ -46,7 +46,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-badge {
   margin-right: 2em;
 }
diff --git a/one/docs/demo/badge/text.vue b/one/docs/demo/badge/text.vue
index 7dca128..34b9f15 100644
--- a/one/docs/demo/badge/text.vue
+++ b/one/docs/demo/badge/text.vue
@@ -41,7 +41,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-badge {
   & + & {
     margin-left: 2em;
diff --git a/one/docs/demo/breadcrumb/redirect.vue b/one/docs/demo/breadcrumb/redirect.vue
index 10a3076..805afa0 100644
--- a/one/docs/demo/breadcrumb/redirect.vue
+++ b/one/docs/demo/breadcrumb/redirect.vue
@@ -48,7 +48,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-breadcrumb:first-child {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/breadcrumb/separator.vue b/one/docs/demo/breadcrumb/separator.vue
index 0a4e888..11ab958 100644
--- a/one/docs/demo/breadcrumb/separator.vue
+++ b/one/docs/demo/breadcrumb/separator.vue
@@ -42,7 +42,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-breadcrumb:first-child {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/breadcrumb/size.vue b/one/docs/demo/breadcrumb/size.vue
index adc7e4a..63f7bbb 100644
--- a/one/docs/demo/breadcrumb/size.vue
+++ b/one/docs/demo/breadcrumb/size.vue
@@ -40,7 +40,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 1em;
 }
diff --git a/one/docs/demo/breadcrumb/style.vue b/one/docs/demo/breadcrumb/style.vue
index bed7e26..ee10033 100644
--- a/one/docs/demo/breadcrumb/style.vue
+++ b/one/docs/demo/breadcrumb/style.vue
@@ -40,7 +40,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 1em;
 }
diff --git a/one/docs/demo/button-group/disabled.vue b/one/docs/demo/button-group/disabled.vue
index 6ea09d2..329a3a4 100644
--- a/one/docs/demo/button-group/disabled.vue
+++ b/one/docs/demo/button-group/disabled.vue
@@ -61,7 +61,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 1em;
 }
diff --git a/one/docs/demo/button-group/items.vue b/one/docs/demo/button-group/items.vue
index 4e1d688..97f0601 100644
--- a/one/docs/demo/button-group/items.vue
+++ b/one/docs/demo/button-group/items.vue
@@ -28,7 +28,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button-group {
   margin-right: 1em;
 }
diff --git a/one/docs/demo/button-group/size.vue b/one/docs/demo/button-group/size.vue
index 114c0ee..ae715cf 100644
--- a/one/docs/demo/button-group/size.vue
+++ b/one/docs/demo/button-group/size.vue
@@ -34,7 +34,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button-group {
   margin-right: 1em;
 }
diff --git a/one/docs/demo/button-group/style.vue b/one/docs/demo/button-group/style.vue
index 79c9fd0..42b5d3d 100644
--- a/one/docs/demo/button-group/style.vue
+++ b/one/docs/demo/button-group/style.vue
@@ -38,7 +38,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 1em;
 }
diff --git a/one/docs/demo/button/disabled.vue b/one/docs/demo/button/disabled.vue
index 820257d..5f71582 100644
--- a/one/docs/demo/button/disabled.vue
+++ b/one/docs/demo/button/disabled.vue
@@ -87,7 +87,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 1em;
 }
diff --git a/one/docs/demo/button/loading.vue b/one/docs/demo/button/loading.vue
index 3518811..19241e2 100644
--- a/one/docs/demo/button/loading.vue
+++ b/one/docs/demo/button/loading.vue
@@ -87,7 +87,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 1em;
 }
diff --git a/one/docs/demo/button/size.vue b/one/docs/demo/button/size.vue
index 5cf472a..51cc935 100644
--- a/one/docs/demo/button/size.vue
+++ b/one/docs/demo/button/size.vue
@@ -28,7 +28,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button {
   margin-right: 1em;
 }
diff --git a/one/docs/demo/button/style.vue b/one/docs/demo/button/style.vue
index 9c9003d..49e58b5 100644
--- a/one/docs/demo/button/style.vue
+++ b/one/docs/demo/button/style.vue
@@ -47,7 +47,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button {
   margin-right: 1em;
 }
diff --git a/one/docs/demo/calendar/range-multiple.vue b/one/docs/demo/calendar/range-multiple.vue
index 349b6b5..ed02904 100644
--- a/one/docs/demo/calendar/range-multiple.vue
+++ b/one/docs/demo/calendar/range-multiple.vue
@@ -54,7 +54,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 article {
   overflow: hidden;
 }
diff --git a/one/docs/demo/carousel/effect.vue b/one/docs/demo/carousel/effect.vue
index 6d5a328..7b16142 100644
--- a/one/docs/demo/carousel/effect.vue
+++ b/one/docs/demo/carousel/effect.vue
@@ -56,7 +56,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 h4 {
   margin: 0 0 10px;
 }
diff --git a/one/docs/demo/carousel/indicator.vue b/one/docs/demo/carousel/indicator.vue
index 386b43a..b549fe0 100644
--- a/one/docs/demo/carousel/indicator.vue
+++ b/one/docs/demo/carousel/indicator.vue
@@ -64,27 +64,28 @@ export default {
       indicatorPosition: 'inside',
       align: 'start',
       indicators: [
-        { label: 'Bar', value: 'bar' },
-        { label: 'Number', value: 'number' },
-        { label: 'Dot', value: 'dot' },
-        { label: 'None', value: 'none' }
+        { label: 'bar', value: 'bar' },
+        { label: 'number', value: 'number' },
+        { label: 'dot', value: 'dot' },
+        { label: 'none', value: 'none' }
       ],
       alignments: [
-        { value: 'start', label: 'start' },
-        { value: 'end', label: 'end' }
+        { label: 'start', value: 'start' },
+        { label: 'end', value: 'end' }
       ],
       positions: [
-        { label: 'Inside', value: 'inside' },
-        { label: 'Outside', value: 'outside' }
+        { label: 'inside', value: 'inside' },
+        { label: 'outside', value: 'outside' }
       ]
     }
   }
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 h4 {
   margin: 0 0 10px;
+
   &:not(:first-child) {
     margin-top: 10px;
   }
diff --git a/one/docs/demo/carousel/slides.vue b/one/docs/demo/carousel/slides.vue
index 7f2a4a0..da85b81 100644
--- a/one/docs/demo/carousel/slides.vue
+++ b/one/docs/demo/carousel/slides.vue
@@ -65,7 +65,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 h4 {
   margin: 0 0 10px;
 }
diff --git a/one/docs/demo/carousel/switch.vue b/one/docs/demo/carousel/switch.vue
index 1d541c0..c059fdb 100644
--- a/one/docs/demo/carousel/switch.vue
+++ b/one/docs/demo/carousel/switch.vue
@@ -53,7 +53,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 h4 {
   margin: 0 0 10px;
 }
diff --git a/one/docs/demo/carousel/vertical.vue b/one/docs/demo/carousel/vertical.vue
index 3870f8f..76b50f6 100644
--- a/one/docs/demo/carousel/vertical.vue
+++ b/one/docs/demo/carousel/vertical.vue
@@ -58,7 +58,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 h4 {
   margin: 0 0 10px;
 }
diff --git a/one/docs/demo/cascader/multiple.vue b/one/docs/demo/cascader/multiple.vue
index d86f252..5e0936b 100644
--- a/one/docs/demo/cascader/multiple.vue
+++ b/one/docs/demo/cascader/multiple.vue
@@ -1,32 +1,52 @@
 <template>
 <article>
   <section class="cascader-config">
-    <veui-checkbox ui="s" v-model="clearable2">Clearable</veui-checkbox>
-    <veui-checkbox ui="s" v-model="showSelectAll2">ShowSelectAll</veui-checkbox>
+    <veui-checkbox
+      v-model="clearable2"
+      ui="s"
+    >
+      Clearable
+    </veui-checkbox>
+    <veui-checkbox
+      v-model="showSelectAll2"
+      ui="s"
+    >
+      ShowSelectAll
+    </veui-checkbox>
     <veui-radio
       v-model="trigger2"
       ui="s"
       value="click"
       name="columnTrigger2"
-    >click to expand</veui-radio>
+    >
+      click to expand
+    </veui-radio>
     <veui-radio
       v-model="trigger2"
       ui="s"
       value="hover"
       name="columnTrigger2"
-    >hover to expand</veui-radio>
+    >
+      hover to expand
+    </veui-radio>
     <label>
       Max:
-      <veui-number-input ui="s" v-model="max2"/>
+      <veui-number-input
+        v-model="max2"
+        ui="s"
+      />
     </label>
     <label>
       columnWidth:
-      <veui-input ui="s" v-model="columnWidth2"/>
+      <veui-input
+        v-model="columnWidth2"
+        ui="s"
+      />
     </label>
   </section>
   <veui-cascader
-    class="mt-3p"
     v-model="value2"
+    class="mt-3p"
     :options="options"
     :searchable="searchable2"
     :column-trigger="trigger2"
@@ -178,7 +198,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .cascader-config {
   display: flex;
   align-items: center;
@@ -194,4 +214,4 @@ export default {
 .mt-3p {
   margin-top: 12px;
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/one/docs/demo/cascader/size.vue b/one/docs/demo/cascader/size.vue
index e139dcd..0eee351 100644
--- a/one/docs/demo/cascader/size.vue
+++ b/one/docs/demo/cascader/size.vue
@@ -141,13 +141,14 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .cascader-wrap {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
-  .veui-cascader + .veui-cascader{
-      margin-top: 12px;
-  }
+}
+
+.veui-cascader + .veui-cascader {
+  margin-top: 12px;
 }
 </style>
diff --git a/one/docs/demo/check-button-group/default.vue b/one/docs/demo/check-button-group/default.vue
index 54a8798..a1531e2 100644
--- a/one/docs/demo/check-button-group/default.vue
+++ b/one/docs/demo/check-button-group/default.vue
@@ -54,7 +54,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/check-button-group/exclusive.vue b/one/docs/demo/check-button-group/exclusive.vue
index 289bbdf..7e9f413 100644
--- a/one/docs/demo/check-button-group/exclusive.vue
+++ b/one/docs/demo/check-button-group/exclusive.vue
@@ -51,7 +51,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/checkbox-group/default.vue b/one/docs/demo/checkbox-group/default.vue
index 67e0247..c08f422 100644
--- a/one/docs/demo/checkbox-group/default.vue
+++ b/one/docs/demo/checkbox-group/default.vue
@@ -54,7 +54,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/checkbox-group/exclusive.vue b/one/docs/demo/checkbox-group/exclusive.vue
index ae958cd..4aefc18 100644
--- a/one/docs/demo/checkbox-group/exclusive.vue
+++ b/one/docs/demo/checkbox-group/exclusive.vue
@@ -51,7 +51,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/checkbox/size.vue b/one/docs/demo/checkbox/size.vue
index 1992953..401de00 100644
--- a/one/docs/demo/checkbox/size.vue
+++ b/one/docs/demo/checkbox/size.vue
@@ -48,10 +48,12 @@ export default {
 }
 </script>
 
-<style lang="stylus" scoped docs>
-.veui-checkbox
-  & + &
-    margin-left 20px
+<style lang="less" scoped>
+.veui-checkbox {
+  & + & {
+    margin-left: 20px;
+  }
+}
 </style>
 
 <docs>
diff --git a/one/docs/demo/collapse/size.vue b/one/docs/demo/collapse/size.vue
index 5611579..cd92541 100644
--- a/one/docs/demo/collapse/size.vue
+++ b/one/docs/demo/collapse/size.vue
@@ -28,7 +28,8 @@ export default {
 }
 </script>
 
-<style lang="stylus" scoped docs>
-section
-  margin-bottom 20px
+<style lang="less" scoped>
+section {
+  margin-bottom: 20px;
+}
 </style>
diff --git a/one/docs/demo/date-picker/default.vue b/one/docs/demo/date-picker/default.vue
index adba1c5..ec3178c 100644
--- a/one/docs/demo/date-picker/default.vue
+++ b/one/docs/demo/date-picker/default.vue
@@ -33,7 +33,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section:not(:last-child) {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/date-picker/range.vue b/one/docs/demo/date-picker/range.vue
index 7fa62b0..c257390 100644
--- a/one/docs/demo/date-picker/range.vue
+++ b/one/docs/demo/date-picker/range.vue
@@ -35,7 +35,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section:not(:last-child) {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/dialog/async.vue b/one/docs/demo/dialog/async.vue
index a8d807c..da0dde2 100644
--- a/one/docs/demo/dialog/async.vue
+++ b/one/docs/demo/dialog/async.vue
@@ -106,7 +106,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 article > .veui-button {
   margin-right: 20px;
 }
diff --git a/one/docs/demo/dialog/custom.vue b/one/docs/demo/dialog/custom.vue
index bc48874..0ff155e 100644
--- a/one/docs/demo/dialog/custom.vue
+++ b/one/docs/demo/dialog/custom.vue
@@ -66,7 +66,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button {
   margin-right: 20px;
 }
diff --git a/one/docs/demo/dialog/draggable.vue b/one/docs/demo/dialog/draggable.vue
index ec4c3c4..9ca3597 100644
--- a/one/docs/demo/dialog/draggable.vue
+++ b/one/docs/demo/dialog/draggable.vue
@@ -31,7 +31,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button {
   margin-right: 20px;
 }
diff --git a/one/docs/demo/dialog/modal.vue b/one/docs/demo/dialog/modal.vue
index 71bac66..af7aefe 100644
--- a/one/docs/demo/dialog/modal.vue
+++ b/one/docs/demo/dialog/modal.vue
@@ -57,7 +57,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button {
   margin-right: 20px;
 }
diff --git a/one/docs/demo/dialog/size.vue b/one/docs/demo/dialog/size.vue
index 60c71d4..983f812 100644
--- a/one/docs/demo/dialog/size.vue
+++ b/one/docs/demo/dialog/size.vue
@@ -59,7 +59,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button {
   margin-right: 20px;
 }
diff --git a/one/docs/demo/dialog/stack.vue b/one/docs/demo/dialog/stack.vue
index 6de0399..86ea025 100644
--- a/one/docs/demo/dialog/stack.vue
+++ b/one/docs/demo/dialog/stack.vue
@@ -47,7 +47,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button {
   margin-right: 20px;
 }
diff --git a/one/docs/demo/dialog/status.vue b/one/docs/demo/dialog/status.vue
index 9f847ba..a69b95b 100644
--- a/one/docs/demo/dialog/status.vue
+++ b/one/docs/demo/dialog/status.vue
@@ -2,10 +2,17 @@
 <article>
   <div class="op-wrap">
     <veui-button @click="aOpen = true">
-        Open Dialog
+      Open Dialog
     </veui-button>
-    <veui-checkbox v-model="loading">Loading</veui-checkbox>
-    <veui-checkbox class="ml-3p" v-model="disabled">Disabled</veui-checkbox>
+    <veui-checkbox v-model="loading">
+      Loading
+    </veui-checkbox>
+    <veui-checkbox
+      v-model="disabled"
+      class="ml-3p"
+    >
+      Disabled
+    </veui-checkbox>
   </div>
   <veui-dialog
     :open.sync="aOpen"
@@ -37,14 +44,14 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button {
   margin-right: 20px;
 }
 .op-wrap {
-    display: flex;
+  display: flex;
 }
 .ml-3p {
-    margin-left: 12px;
+  margin-left: 12px;
 }
 </style>
diff --git a/one/docs/demo/directives/drag/axis.vue b/one/docs/demo/directives/drag/axis.vue
index bd21b85..cbfc170 100644
--- a/one/docs/demo/directives/drag/axis.vue
+++ b/one/docs/demo/directives/drag/axis.vue
@@ -27,16 +27,15 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
-@import "~veui-theme-dls/lib.less";
-
+<style lang="less" scoped>
 article {
   height: 200px;
 }
 
 .target {
-  .size(80px);
-  background: @veui-gray-color-6;
+  width: 80px;
+  height: 80px;
+  background: #e7e7e7;
   display: inline-flex;
   margin-right: 40px;
   align-items: center;
@@ -45,7 +44,8 @@ article {
 }
 
 .container {
-  .size(100%, 300px);
-  background: @veui-gray-color-8;
+  width: 100%;
+  height: 300px;
+  background: #f7f7f7;
 }
 </style>
diff --git a/one/docs/demo/directives/drag/base.vue b/one/docs/demo/directives/drag/base.vue
index 293575e..fa9aeb3 100644
--- a/one/docs/demo/directives/drag/base.vue
+++ b/one/docs/demo/directives/drag/base.vue
@@ -18,11 +18,11 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
-@import "~veui-theme-dls/lib.less";
+<style lang="less" scoped>
 
 .target {
-  .size(80px);
+  width: 80px;
+  height: 80px;
   background: @veui-gray-color-6;
 }
 </style>
diff --git a/one/docs/demo/directives/drag/containment.vue b/one/docs/demo/directives/drag/containment.vue
index f4e6d46..255be60 100644
--- a/one/docs/demo/directives/drag/containment.vue
+++ b/one/docs/demo/directives/drag/containment.vue
@@ -23,16 +23,16 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
-@import "~veui-theme-dls/lib.less";
-
+<style lang="less" scoped>
 .target {
-  .size(80px);
-  background: @veui-gray-color-6;
+  width: 80px;
+  height: 80px;
+  background: #e7e7e7;
 }
 
 .container {
-  .size(100%, 300px);
-  background: @veui-gray-color-8;
+  width: 100%;
+  height: 300px;
+  background: #f7f7f7;
 }
 </style>
diff --git a/one/docs/demo/directives/drag/targets.vue b/one/docs/demo/directives/drag/targets.vue
index 5e6d688..1059014 100644
--- a/one/docs/demo/directives/drag/targets.vue
+++ b/one/docs/demo/directives/drag/targets.vue
@@ -28,12 +28,11 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
-@import "~veui-theme-dls/lib.less";
-
+<style lang="less" scoped>
 .target {
-  .size(80px);
-  background: @veui-gray-color-6;
+  width: 80px;
+  height: 80px;
+  background: #e7e7e7;
   display: inline-flex;
   margin-right: 40px;
   align-items: center;
@@ -42,7 +41,8 @@ export default {
 }
 
 .container {
-  .size(100%, 300px);
-  background: @veui-gray-color-8;
+  width: 100%;
+  height: 300px;
+  background: #f7f7f7;
 }
 </style>
diff --git a/one/docs/demo/directives/nudge.vue b/one/docs/demo/directives/nudge.vue
index 2b60864..2ccee48 100644
--- a/one/docs/demo/directives/nudge.vue
+++ b/one/docs/demo/directives/nudge.vue
@@ -45,19 +45,18 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
-@import "~veui-theme-dls/lib.less";
-
+<style lang="less" scoped>
 article {
   display: flex;
 }
 
 .box {
-  .size(200px, 50px);
+  width: 200px;
+  height: 50px;
   display: flex;
   align-items: center;
   justify-content: center;
-  border: 1px solid @veui-gray-color-5;
+  border: 1px solid #dbdbdb;
   background: #fff;
   margin-right: 40px;
   user-select: none;
@@ -67,7 +66,7 @@ article {
   line-height: 1;
 
   &:focus {
-    background-color: @veui-gray-color-6;
+    background-color: #e7e7e7;
   }
 }
 
diff --git a/one/docs/demo/directives/outside/click.vue b/one/docs/demo/directives/outside/click.vue
index 59e1a4a..6f63669 100644
--- a/one/docs/demo/directives/outside/click.vue
+++ b/one/docs/demo/directives/outside/click.vue
@@ -36,12 +36,11 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
-@import "~veui-theme-dls/lib.less";
-
+<style lang="less" scoped>
 .box {
-  .size(500px, 100px);
-  background: @veui-gray-color-8;
+  width: 500px;
+  height: 100px;
+  background: #f7f7f7;
   display: flex;
   align-items: center;
   justify-content: center;
diff --git a/one/docs/demo/directives/outside/hover-with-delay.vue b/one/docs/demo/directives/outside/hover-with-delay.vue
index 47f1313..f096860 100644
--- a/one/docs/demo/directives/outside/hover-with-delay.vue
+++ b/one/docs/demo/directives/outside/hover-with-delay.vue
@@ -43,14 +43,13 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
-@import "~veui-theme-dls/lib.less";
-
+<style lang="less" scoped>
 .box1,
 .box2,
 .box3 {
-  .size(200px, 100px);
-  background: @veui-gray-color-8;
+  width: 200px;
+  height: 100px;
+  background: #f7f7f7;
   margin-right: 30px;
   display: inline-flex;
   align-items: center;
diff --git a/one/docs/demo/directives/outside/hover.vue b/one/docs/demo/directives/outside/hover.vue
index c6fd975..df8d7ef 100644
--- a/one/docs/demo/directives/outside/hover.vue
+++ b/one/docs/demo/directives/outside/hover.vue
@@ -31,12 +31,11 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
-@import "~veui-theme-dls/lib.less";
-
+<style lang="less" scoped>
 .box {
-  .size(500px, 100px);
-  background: @veui-gray-color-8;
+  width: 500px;
+  height: 100px;
+  background: #f7f7f7;
   display: flex;
   align-items: center;
   justify-content: center;
diff --git a/one/docs/demo/directives/resize.vue b/one/docs/demo/directives/resize.vue
index 66badc6..763cc55 100644
--- a/one/docs/demo/directives/resize.vue
+++ b/one/docs/demo/directives/resize.vue
@@ -86,7 +86,7 @@ export default {
 }
 </script>
 
-<style lang="less" docs scoped>
+<style lang="less" scoped>
 .demo {
   height: 50px;
   line-height: 50px;
diff --git a/one/docs/demo/directives/tooltip.vue b/one/docs/demo/directives/tooltip.vue
index bc431ad..39dfe88 100644
--- a/one/docs/demo/directives/tooltip.vue
+++ b/one/docs/demo/directives/tooltip.vue
@@ -39,7 +39,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button + .veui-button {
   margin-left: 8px;
 }
diff --git a/one/docs/demo/drawer/custom.vue b/one/docs/demo/drawer/custom.vue
index e05e98b..e901087 100644
--- a/one/docs/demo/drawer/custom.vue
+++ b/one/docs/demo/drawer/custom.vue
@@ -66,7 +66,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button {
   margin-right: 20px;
 }
diff --git a/one/docs/demo/drawer/modal.vue b/one/docs/demo/drawer/modal.vue
index ff42759..d073622 100644
--- a/one/docs/demo/drawer/modal.vue
+++ b/one/docs/demo/drawer/modal.vue
@@ -57,7 +57,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button {
   margin-right: 20px;
 }
diff --git a/one/docs/demo/dropdown/disable.vue b/one/docs/demo/dropdown/disable.vue
index 4a8bd77..09da4d6 100644
--- a/one/docs/demo/dropdown/disable.vue
+++ b/one/docs/demo/dropdown/disable.vue
@@ -98,7 +98,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-dropdown {
   margin-left: 1em;
 }
diff --git a/one/docs/demo/dropdown/other.vue b/one/docs/demo/dropdown/other.vue
index 5529b6c..c06bb11 100644
--- a/one/docs/demo/dropdown/other.vue
+++ b/one/docs/demo/dropdown/other.vue
@@ -122,9 +122,10 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .container {
   margin-bottom: 1em;
+
   .veui-dropdown {
     margin-left: 1em;
   }
diff --git a/one/docs/demo/dropdown/searchable.vue b/one/docs/demo/dropdown/searchable.vue
index 8d417cd..915ac23 100644
--- a/one/docs/demo/dropdown/searchable.vue
+++ b/one/docs/demo/dropdown/searchable.vue
@@ -161,7 +161,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-dropdown {
   margin-left: 1em;
 }
diff --git a/one/docs/demo/dropdown/size.vue b/one/docs/demo/dropdown/size.vue
index 09786c3..597066b 100644
--- a/one/docs/demo/dropdown/size.vue
+++ b/one/docs/demo/dropdown/size.vue
@@ -64,7 +64,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-dropdown {
   max-width: 120px;
   margin-right: 10px;
diff --git a/one/docs/demo/dropdown/style.vue b/one/docs/demo/dropdown/style.vue
index 89b726f..6550f49 100644
--- a/one/docs/demo/dropdown/style.vue
+++ b/one/docs/demo/dropdown/style.vue
@@ -50,7 +50,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-dropdown {
   & + & {
     margin-left: 1em;
diff --git a/one/docs/demo/embedded/size.vue b/one/docs/demo/embedded/size.vue
index ab93381..2df5258 100644
--- a/one/docs/demo/embedded/size.vue
+++ b/one/docs/demo/embedded/size.vue
@@ -43,7 +43,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/filter-panel/default.vue b/one/docs/demo/filter-panel/default.vue
index 02a1204..8732dbf 100644
--- a/one/docs/demo/filter-panel/default.vue
+++ b/one/docs/demo/filter-panel/default.vue
@@ -56,7 +56,7 @@ export default {
 }
 </script>
 
-<style lang="less" docs scoped>
+<style lang="less" scoped>
 .item {
   padding: 8px 15px;
 }
diff --git a/one/docs/demo/focus-visible.vue b/one/docs/demo/focus-visible.vue
index 2982db3..20c07eb 100644
--- a/one/docs/demo/focus-visible.vue
+++ b/one/docs/demo/focus-visible.vue
@@ -6,29 +6,29 @@
 </article>
 </template>
 
-<style lang="stylus" scoped docs>
-p
-  margin-bottom 1em
-
-button
-  width 120px
-  height 36px
-  margin-right 1em
-  background #fff
-  border solid 1px #999
-  padding 3px 6px
-  text-align center
-  transition background-color 0.3s
-
-  &:hover
-    background-color #f8f8f8
-
-  &:active
-    background-color #eee
-</style>
-
 <style lang="less" scoped>
+p {
+  margin-bottom: 1em;
+}
+
 button {
+  width: 120px;
+  height: 36px;
+  margin-right: 1em;
+  background: #fff;
+  border: solid 1px #999;
+  padding: 3px 6px;
+  text-align: center;
+  transition: background-color 0.3s;
+
+  &:hover {
+    background-color: #f8f8f8;
+  }
+
+  &:active {
+    background-color: #eee;
+  }
+
   &:focus {
     outline: 2px solid #eee;
   }
diff --git a/one/docs/demo/form/disabled.vue b/one/docs/demo/form/disabled.vue
index 7ab0023..9f655ce 100644
--- a/one/docs/demo/form/disabled.vue
+++ b/one/docs/demo/form/disabled.vue
@@ -37,7 +37,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/form/readonly.vue b/one/docs/demo/form/readonly.vue
index 3996c2c..671d571 100644
--- a/one/docs/demo/form/readonly.vue
+++ b/one/docs/demo/form/readonly.vue
@@ -37,7 +37,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/grid/default.vue b/one/docs/demo/grid/default.vue
index f663e6b..6cc624b 100644
--- a/one/docs/demo/grid/default.vue
+++ b/one/docs/demo/grid/default.vue
@@ -69,9 +69,7 @@ export default {
     margin: 2px 0; /* Just for showcase */
   }
 }
-</style>
 
-<style lang="less" scoped docs>
 .content {
   background-color: #eee;
   height: 100%;
diff --git a/one/docs/demo/grid/fixed.vue b/one/docs/demo/grid/fixed.vue
index 2874303..29324b7 100644
--- a/one/docs/demo/grid/fixed.vue
+++ b/one/docs/demo/grid/fixed.vue
@@ -60,9 +60,7 @@ article {
     margin: 2px 0; /* Just for showcase */
   }
 }
-</style>
 
-<style lang="less" scoped docs>
 .content {
   background-color: #eee;
   height: 100%;
diff --git a/one/docs/demo/icon/default.vue b/one/docs/demo/icon/default.vue
index 2875a8a..c5e746a 100644
--- a/one/docs/demo/icon/default.vue
+++ b/one/docs/demo/icon/default.vue
@@ -31,13 +31,13 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 article {
   overflow: hidden;
 }
 
 .item {
-  @grid-size: 128px;
+  @grid-size: 120px;
   float: left;
   width: @grid-size;
   height: calc(@grid-size + 3em);
@@ -51,7 +51,7 @@ article {
     font-size: 1.5em;
     line-height: @grid-size;
     border-radius: 4px;
-    transition: border-color .2s;
+    transition: border-color 0.2s;
 
     &:hover {
       border-color: #ccc;
diff --git a/one/docs/demo/input-group/default.vue b/one/docs/demo/input-group/default.vue
index 267539a..fa11b32 100644
--- a/one/docs/demo/input-group/default.vue
+++ b/one/docs/demo/input-group/default.vue
@@ -119,7 +119,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/input/disabled.vue b/one/docs/demo/input/disabled.vue
index a8967ac..9a34dcf 100644
--- a/one/docs/demo/input/disabled.vue
+++ b/one/docs/demo/input/disabled.vue
@@ -53,7 +53,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 1em;
 }
diff --git a/one/docs/demo/input/readonly.vue b/one/docs/demo/input/readonly.vue
index a3438d5..9f34b90 100644
--- a/one/docs/demo/input/readonly.vue
+++ b/one/docs/demo/input/readonly.vue
@@ -53,7 +53,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 1em;
 }
diff --git a/one/docs/demo/input/size.vue b/one/docs/demo/input/size.vue
index 774053d..4c9e654 100644
--- a/one/docs/demo/input/size.vue
+++ b/one/docs/demo/input/size.vue
@@ -32,7 +32,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 1em;
 }
diff --git a/one/docs/demo/label/default.vue b/one/docs/demo/label/default.vue
index 0d8a650..bbfa636 100644
--- a/one/docs/demo/label/default.vue
+++ b/one/docs/demo/label/default.vue
@@ -44,7 +44,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/lightbox/default.vue b/one/docs/demo/lightbox/default.vue
index f4082ed..a16b4ee 100644
--- a/one/docs/demo/lightbox/default.vue
+++ b/one/docs/demo/lightbox/default.vue
@@ -3,18 +3,24 @@
   <div>
     <veui-check-box
       v-model="wrap"
-    >循环播放</veui-check-box>
+    >
+      循环播放
+    </veui-check-box>
     <veui-check-box
       v-model="indicator"
       true-value="number"
       false-value="none"
-    >头部页码</veui-check-box>
+    >
+      头部页码
+    </veui-check-box>
   </div>
   <veui-button
     class="mt-3p"
     ui="primary"
     @click="open = true"
-  >展现灯箱</veui-button>
+  >
+    展现灯箱
+  </veui-button>
   <veui-lightbox
     :open.sync="open"
     :datasource="items"
@@ -41,7 +47,7 @@ export default {
     }
   },
   computed: {
-    items() {
+    items () {
       return [
         {
           src:
@@ -73,11 +79,12 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-checkbox {
   margin-right: 15px;
 }
+
 .mt-3p {
   margin-top: 12px;
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/one/docs/demo/link/default.vue b/one/docs/demo/link/default.vue
index b52caea..0a363b5 100644
--- a/one/docs/demo/link/default.vue
+++ b/one/docs/demo/link/default.vue
@@ -44,7 +44,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 h4 {
   margin-top: 0;
 }
diff --git a/one/docs/demo/loading/layout.vue b/one/docs/demo/loading/layout.vue
index e3cd9db..a1d2e15 100644
--- a/one/docs/demo/loading/layout.vue
+++ b/one/docs/demo/loading/layout.vue
@@ -22,7 +22,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .container {
   display: flex;
   align-items: flex-end;
diff --git a/one/docs/demo/loading/size.vue b/one/docs/demo/loading/size.vue
index df932f8..68fd501 100644
--- a/one/docs/demo/loading/size.vue
+++ b/one/docs/demo/loading/size.vue
@@ -76,14 +76,16 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs-loading>
+<style lang="less" scoped>
 .reverse {
   background: #ccc;
   padding: 8px;
 }
+
 .veui-loading {
   margin-left: 1em;
 }
+
 .container {
   margin-bottom: 2em;
 }
diff --git a/one/docs/demo/loading/slot.vue b/one/docs/demo/loading/slot.vue
index 2d42635..a781bbe 100644
--- a/one/docs/demo/loading/slot.vue
+++ b/one/docs/demo/loading/slot.vue
@@ -60,7 +60,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .reverse {
   background: #ccc;
   padding: 8px;
diff --git a/one/docs/demo/loading/style.vue b/one/docs/demo/loading/style.vue
index ea253f2..2eb076c 100644
--- a/one/docs/demo/loading/style.vue
+++ b/one/docs/demo/loading/style.vue
@@ -32,10 +32,11 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-loading {
   margin-left: 1em;
 }
+
 .reverse {
   background: #ccc;
   padding: 8px;
diff --git a/one/docs/demo/number-input/disabled.vue b/one/docs/demo/number-input/disabled.vue
index 32c0376..91fe067 100644
--- a/one/docs/demo/number-input/disabled.vue
+++ b/one/docs/demo/number-input/disabled.vue
@@ -47,7 +47,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section,
 p {
   margin-bottom: 1em;
diff --git a/one/docs/demo/number-input/readonly.vue b/one/docs/demo/number-input/readonly.vue
index 4ce38b1..8618430 100644
--- a/one/docs/demo/number-input/readonly.vue
+++ b/one/docs/demo/number-input/readonly.vue
@@ -47,7 +47,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section,
 p {
   margin-bottom: 1em;
diff --git a/one/docs/demo/number-input/size.vue b/one/docs/demo/number-input/size.vue
index 9e76e02..63ebe13 100644
--- a/one/docs/demo/number-input/size.vue
+++ b/one/docs/demo/number-input/size.vue
@@ -33,7 +33,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 p {
   margin-bottom: 1em;
 }
diff --git a/one/docs/demo/overlay/position.vue b/one/docs/demo/overlay/position.vue
index 6b779c3..1ca9dd5 100644
--- a/one/docs/demo/overlay/position.vue
+++ b/one/docs/demo/overlay/position.vue
@@ -40,7 +40,7 @@ export default {
 }
 </script>
 
-<style lang="less">
+<style lang="less" scoped>
 .centered-overlay {
   position: fixed;
   top: 50%;
@@ -49,15 +49,11 @@ export default {
   width: 200px;
   height: 100px;
 }
-</style>
-
-<style lang="less" docs>
-@import "~veui-theme-dls/lib.less";
 
 .centered-overlay {
   line-height: 100px;
   text-align: center;
-  border: 1px solid @veui-gray-color-5;
+  border: 1px solid #dbdbdb;
   background-color: #fff;
 }
 </style>
diff --git a/one/docs/demo/overlay/relative-base.vue b/one/docs/demo/overlay/relative-base.vue
index c79128b..79e43e3 100644
--- a/one/docs/demo/overlay/relative-base.vue
+++ b/one/docs/demo/overlay/relative-base.vue
@@ -42,4 +42,21 @@ export default {
 }
 </script>
 
-<style lang="less" src="./relative.less" docs></style>
+<style lang="less" scoped>
+.veui-overlay {
+  display: none;
+}
+
+.relative-overlay {
+  width: 200px;
+  height: 100px;
+  line-height: 100px;
+  text-align: center;
+  border: 1px solid #dbdbdb;
+  background-color: #fff;
+
+  .veui-button {
+    margin-left: 10px;
+  }
+}
+</style>
diff --git a/one/docs/demo/overlay/relative.less b/one/docs/demo/overlay/relative.less
deleted file mode 100644
index fad24a3..0000000
--- a/one/docs/demo/overlay/relative.less
+++ /dev/null
@@ -1,18 +0,0 @@
-@import "~veui-theme-dls/lib.less";
-
-.veui-overlay {
-  display: none;
-}
-
-.relative-overlay {
-  width: 200px;
-  height: 100px;
-  line-height: 100px;
-  text-align: center;
-  border: 1px solid @veui-gray-color-5;
-  background-color: #fff;
-
-  .veui-button {
-    margin-left: 10px;
-  }
-}
diff --git a/one/docs/demo/overlay/stack-display-order-with-on-overlay.vue b/one/docs/demo/overlay/stack-display-order-with-on-overlay.vue
index fbbe44b..ad438c4 100644
--- a/one/docs/demo/overlay/stack-display-order-with-on-overlay.vue
+++ b/one/docs/demo/overlay/stack-display-order-with-on-overlay.vue
@@ -87,14 +87,21 @@ export default {
 }
 </script>
 
-<style lang="less" docs scoped>
+<style lang="less" scoped>
 .veui-overlay {
   display: none;
 }
 
-.veui-button {
-  margin-right: 10px;
+.relative-overlay {
+  width: 200px;
+  height: 100px;
+  line-height: 100px;
+  text-align: center;
+  border: 1px solid #dbdbdb;
+  background-color: #fff;
+
+  .veui-button {
+    margin-left: 10px;
+  }
 }
 </style>
-
-<style lang="less" src="./relative.less" docs></style>
diff --git a/one/docs/demo/overlay/stack-display-order.vue b/one/docs/demo/overlay/stack-display-order.vue
index ef5b3d2..e5ef7c3 100644
--- a/one/docs/demo/overlay/stack-display-order.vue
+++ b/one/docs/demo/overlay/stack-display-order.vue
@@ -71,14 +71,21 @@ export default {
 }
 </script>
 
-<style lang="less" docs scoped>
+<style lang="less" scoped>
 .veui-overlay {
   display: none;
 }
 
-.veui-button {
-  margin-right: 10px;
+.relative-overlay {
+  width: 200px;
+  height: 100px;
+  line-height: 100px;
+  text-align: center;
+  border: 1px solid #dbdbdb;
+  background-color: #fff;
+
+  .veui-button {
+    margin-left: 10px;
+  }
 }
 </style>
-
-<style lang="less" src="./relative.less" docs></style>
diff --git a/one/docs/demo/overlay/stack-on-overlay.vue b/one/docs/demo/overlay/stack-on-overlay.vue
index eedcc9f..62c0d44 100644
--- a/one/docs/demo/overlay/stack-on-overlay.vue
+++ b/one/docs/demo/overlay/stack-on-overlay.vue
@@ -60,10 +60,21 @@ export default {
 }
 </script>
 
-<style lang="less" docs scoped>
-.veui-button {
-  margin-right: 10px;
+<style lang="less" scoped>
+.veui-overlay {
+  display: none;
+}
+
+.relative-overlay {
+  width: 200px;
+  height: 100px;
+  line-height: 100px;
+  text-align: center;
+  border: 1px solid #dbdbdb;
+  background-color: #fff;
+
+  .veui-button {
+    margin-left: 10px;
+  }
 }
 </style>
-
-<style lang="less" src="./relative.less" docs></style>
diff --git a/one/docs/demo/pagination/goto.vue b/one/docs/demo/pagination/goto.vue
index f78acff..03f1ae6 100644
--- a/one/docs/demo/pagination/goto.vue
+++ b/one/docs/demo/pagination/goto.vue
@@ -30,7 +30,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 article {
   text-align: right;
 }
diff --git a/one/docs/demo/pagination/size.vue b/one/docs/demo/pagination/size.vue
index 26d9843..35b7af5 100644
--- a/one/docs/demo/pagination/size.vue
+++ b/one/docs/demo/pagination/size.vue
@@ -41,7 +41,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 article {
   text-align: right;
 }
diff --git a/one/docs/demo/popover/position.vue b/one/docs/demo/popover/position.vue
index 40841a8..5db6f0d 100644
--- a/one/docs/demo/popover/position.vue
+++ b/one/docs/demo/popover/position.vue
@@ -192,7 +192,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-grid-container {
   width: 80%;
   min-width: 600px;
diff --git a/one/docs/demo/popover/trigger.vue b/one/docs/demo/popover/trigger.vue
index d2cf6d9..74bfb47 100644
--- a/one/docs/demo/popover/trigger.vue
+++ b/one/docs/demo/popover/trigger.vue
@@ -62,7 +62,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section + section {
   margin-top: 20px;
 }
diff --git a/one/docs/demo/popover/ui.vue b/one/docs/demo/popover/ui.vue
index 69fb81d..698f993 100644
--- a/one/docs/demo/popover/ui.vue
+++ b/one/docs/demo/popover/ui.vue
@@ -53,7 +53,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section + section {
   margin-top: 20px;
 }
diff --git a/one/docs/demo/progress/default.vue b/one/docs/demo/progress/default.vue
index 353089d..fff3a5c 100644
--- a/one/docs/demo/progress/default.vue
+++ b/one/docs/demo/progress/default.vue
@@ -66,7 +66,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section + section {
   margin-top: 20px;
 }
diff --git a/one/docs/demo/radio-button-group/default.vue b/one/docs/demo/radio-button-group/default.vue
index 9c06cde..a738c14 100644
--- a/one/docs/demo/radio-button-group/default.vue
+++ b/one/docs/demo/radio-button-group/default.vue
@@ -66,7 +66,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/radio-group/default.vue b/one/docs/demo/radio-group/default.vue
index bf2f56b..bd9d6d6 100644
--- a/one/docs/demo/radio-group/default.vue
+++ b/one/docs/demo/radio-group/default.vue
@@ -51,7 +51,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/radio/model.vue b/one/docs/demo/radio/model.vue
index efa4d6f..51c247c 100644
--- a/one/docs/demo/radio/model.vue
+++ b/one/docs/demo/radio/model.vue
@@ -40,7 +40,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-radio {
   margin-right: 20px;
 }
diff --git a/one/docs/demo/radio/size.vue b/one/docs/demo/radio/size.vue
index 8b38b7b..d56d863 100644
--- a/one/docs/demo/radio/size.vue
+++ b/one/docs/demo/radio/size.vue
@@ -36,7 +36,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-radio {
   margin-right: 20px;
 }
diff --git a/one/docs/demo/region-picker/default.vue b/one/docs/demo/region-picker/default.vue
index 6ab6c05..ae3e087 100644
--- a/one/docs/demo/region-picker/default.vue
+++ b/one/docs/demo/region-picker/default.vue
@@ -33,7 +33,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 h4 {
   margin-top: 0;
 }
diff --git a/one/docs/demo/search-box/disabled.vue b/one/docs/demo/search-box/disabled.vue
index 3db2e5d..51a4f77 100644
--- a/one/docs/demo/search-box/disabled.vue
+++ b/one/docs/demo/search-box/disabled.vue
@@ -58,7 +58,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 1em;
 }
diff --git a/one/docs/demo/search-box/size.vue b/one/docs/demo/search-box/size.vue
index 573407d..577560c 100644
--- a/one/docs/demo/search-box/size.vue
+++ b/one/docs/demo/search-box/size.vue
@@ -33,7 +33,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .container {
   margin-bottom: 1em;
   .veui-search-box {
diff --git a/one/docs/demo/search-box/style.vue b/one/docs/demo/search-box/style.vue
index 62847fc..ae4ca2a 100644
--- a/one/docs/demo/search-box/style.vue
+++ b/one/docs/demo/search-box/style.vue
@@ -15,7 +15,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-search-box {
   margin-right: 1em;
 }
diff --git a/one/docs/demo/select/inline.vue b/one/docs/demo/select/inline.vue
index 79488c2..ffa4f4f 100644
--- a/one/docs/demo/select/inline.vue
+++ b/one/docs/demo/select/inline.vue
@@ -87,7 +87,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-select {
   width: 180px;
 }
diff --git a/one/docs/demo/select/multiple.vue b/one/docs/demo/select/multiple.vue
index 881da4c..2456872 100644
--- a/one/docs/demo/select/multiple.vue
+++ b/one/docs/demo/select/multiple.vue
@@ -64,7 +64,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 1em;
 }
diff --git a/one/docs/demo/select/size.vue b/one/docs/demo/select/size.vue
index 3d04339..b225d0c 100644
--- a/one/docs/demo/select/size.vue
+++ b/one/docs/demo/select/size.vue
@@ -51,7 +51,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-select {
   max-width: 120px;
   margin-right: 10px;
diff --git a/one/docs/demo/slider/variant.vue b/one/docs/demo/slider/variant.vue
index 9943a1c..d042dbd 100644
--- a/one/docs/demo/slider/variant.vue
+++ b/one/docs/demo/slider/variant.vue
@@ -91,9 +91,7 @@ export default {
   border: 1px solid #fff;
   font-size: 12px;
 }
-</style>
 
-<style lang="less" scoped docs>
 section {
   margin-top: 1em;
   background-color: #fafafa;
diff --git a/one/docs/demo/steps/default.vue b/one/docs/demo/steps/default.vue
index 2e5c0f7..6917e61 100644
--- a/one/docs/demo/steps/default.vue
+++ b/one/docs/demo/steps/default.vue
@@ -98,7 +98,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 h4 {
   margin: 0 0 10px;
 }
diff --git a/one/docs/demo/steps/status.vue b/one/docs/demo/steps/status.vue
index 2d5e679..71e435f 100644
--- a/one/docs/demo/steps/status.vue
+++ b/one/docs/demo/steps/status.vue
@@ -39,7 +39,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 h4 {
   margin: 0 0 10px;
 }
diff --git a/one/docs/demo/switch/size.vue b/one/docs/demo/switch/size.vue
index d77f1ef..c2f609d 100644
--- a/one/docs/demo/switch/size.vue
+++ b/one/docs/demo/switch/size.vue
@@ -49,7 +49,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/table/basic.vue b/one/docs/demo/table/basic.vue
index 7d29384..bcc9429 100644
--- a/one/docs/demo/table/basic.vue
+++ b/one/docs/demo/table/basic.vue
@@ -136,7 +136,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/table/desc.vue b/one/docs/demo/table/desc.vue
index 32fdde2..135e2a9 100644
--- a/one/docs/demo/table/desc.vue
+++ b/one/docs/demo/table/desc.vue
@@ -25,7 +25,9 @@
         </template>
         <template #desc="{ close }">
           <p>This is a description for bid.</p>
-          <veui-button @click="close">close</veui-button>
+          <veui-button @click="close">
+            close
+          </veui-button>
         </template>
       </veui-table-column>
     </veui-table>
@@ -81,7 +83,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/table/filter.vue b/one/docs/demo/table/filter.vue
index d8bdb59..152cdec 100644
--- a/one/docs/demo/table/filter.vue
+++ b/one/docs/demo/table/filter.vue
@@ -134,9 +134,7 @@ export default {
 .veui-checkbox {
   margin: 8px 16px;
 }
-</style>
 
-<style lang="less" scoped docs>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/table/fixed.vue b/one/docs/demo/table/fixed.vue
index 2b0e716..aa4b35a 100644
--- a/one/docs/demo/table/fixed.vue
+++ b/one/docs/demo/table/fixed.vue
@@ -122,7 +122,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/tabs/style.vue b/one/docs/demo/tabs/style.vue
index 7d8c1cd..f849f52 100644
--- a/one/docs/demo/tabs/style.vue
+++ b/one/docs/demo/tabs/style.vue
@@ -61,7 +61,7 @@ export default {
 }
 </script>
 
-<style lang="less" docs scoped>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/tag/removable.vue b/one/docs/demo/tag/removable.vue
index 458da73..357d795 100644
--- a/one/docs/demo/tag/removable.vue
+++ b/one/docs/demo/tag/removable.vue
@@ -44,9 +44,7 @@ export default {
 .veui-tag {
   margin-right: 10px;
 }
-</style>
 
-<style lang="less" scoped docs>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/tag/selectable.vue b/one/docs/demo/tag/selectable.vue
index 499c744..f36a8c5 100644
--- a/one/docs/demo/tag/selectable.vue
+++ b/one/docs/demo/tag/selectable.vue
@@ -44,9 +44,7 @@ export default {
 .veui-tag {
   margin-right: 10px;
 }
-</style>
 
-<style lang="less" scoped docs>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/tag/size.vue b/one/docs/demo/tag/size.vue
index 37f6db1..908c4c4 100644
--- a/one/docs/demo/tag/size.vue
+++ b/one/docs/demo/tag/size.vue
@@ -63,9 +63,7 @@ export default {
 .veui-tag {
   margin-right: 10px;
 }
-</style>
 
-<style lang="less" scoped docs>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/textarea/disabled.vue b/one/docs/demo/textarea/disabled.vue
index 091f176..f15fb29 100644
--- a/one/docs/demo/textarea/disabled.vue
+++ b/one/docs/demo/textarea/disabled.vue
@@ -39,7 +39,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 1em;
 }
diff --git a/one/docs/demo/textarea/readonly.vue b/one/docs/demo/textarea/readonly.vue
index 8ce3fe7..6721c06 100644
--- a/one/docs/demo/textarea/readonly.vue
+++ b/one/docs/demo/textarea/readonly.vue
@@ -41,7 +41,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 1em;
 }
diff --git a/one/docs/demo/time-picker/mode.vue b/one/docs/demo/time-picker/mode.vue
index 9f82555..495cafb 100644
--- a/one/docs/demo/time-picker/mode.vue
+++ b/one/docs/demo/time-picker/mode.vue
@@ -36,7 +36,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section {
   margin-bottom: 20px;
 }
diff --git a/one/docs/demo/toast/default.vue b/one/docs/demo/toast/default.vue
index 0572e27..2cd38c6 100644
--- a/one/docs/demo/toast/default.vue
+++ b/one/docs/demo/toast/default.vue
@@ -42,7 +42,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-toast {
   position: relative;
 }
diff --git a/one/docs/demo/toast/plugin.vue b/one/docs/demo/toast/plugin.vue
index 7159b0d..8979313 100644
--- a/one/docs/demo/toast/plugin.vue
+++ b/one/docs/demo/toast/plugin.vue
@@ -34,7 +34,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button {
   margin-right: 20px;
 }
diff --git a/one/docs/demo/tooltip/position.vue b/one/docs/demo/tooltip/position.vue
index 38712c1..3bfd515 100644
--- a/one/docs/demo/tooltip/position.vue
+++ b/one/docs/demo/tooltip/position.vue
@@ -192,7 +192,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-grid-container {
   width: 80%;
   min-width: 600px;
diff --git a/one/docs/demo/tooltip/style.vue b/one/docs/demo/tooltip/style.vue
index 0a45313..0a9c49b 100644
--- a/one/docs/demo/tooltip/style.vue
+++ b/one/docs/demo/tooltip/style.vue
@@ -38,7 +38,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section + section {
   margin-top: 20px;
 }
diff --git a/one/docs/demo/tooltip/trigger.vue b/one/docs/demo/tooltip/trigger.vue
index 42f20b6..95264a5 100644
--- a/one/docs/demo/tooltip/trigger.vue
+++ b/one/docs/demo/tooltip/trigger.vue
@@ -62,7 +62,7 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 section + section {
   margin-top: 20px;
 }
diff --git a/one/docs/demo/transfer/size.vue b/one/docs/demo/transfer/size.vue
index 0567e7c..0fe055d 100644
--- a/one/docs/demo/transfer/size.vue
+++ b/one/docs/demo/transfer/size.vue
@@ -156,8 +156,8 @@ export default {
 }
 </script>
 
-<style lang="stylus" scoped docs>
-section
-  margin-bottom 20px
-
+<style lang="less" scoped>
+section {
+  margin-bottom: 20px;
+}
 </style>
diff --git a/one/docs/demo/tree/custom-item.vue b/one/docs/demo/tree/custom-item.vue
index bad3976..ebb9999 100644
--- a/one/docs/demo/tree/custom-item.vue
+++ b/one/docs/demo/tree/custom-item.vue
@@ -176,11 +176,9 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
-@import "~veui-theme-dls/lib.less";
-
+<style lang="less" scoped>
 article {
-  .clearfix();
+  display: flex;
 }
 
 h4 {
@@ -188,12 +186,9 @@ h4 {
 }
 
 section {
-  float: left;
   width: 45%;
 }
-</style>
 
-<style lang="less">
 .custom-toggle {
   margin-right: 4px;
 }
diff --git a/one/docs/demo/tree/default.vue b/one/docs/demo/tree/default.vue
index b345bf6..1b576f6 100644
--- a/one/docs/demo/tree/default.vue
+++ b/one/docs/demo/tree/default.vue
@@ -165,7 +165,11 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
+article {
+  display: flex;
+}
+
 h4 {
   margin: 0;
 }
@@ -175,10 +179,5 @@ h4 + h4 {
 
 section {
   width: 45%;
-  float: left;
-}
-
-article {
-  overflow: hidden;
 }
 </style>
diff --git a/one/docs/demo/tree/size.vue b/one/docs/demo/tree/size.vue
index fd683d0..11fda3a 100644
--- a/one/docs/demo/tree/size.vue
+++ b/one/docs/demo/tree/size.vue
@@ -69,13 +69,12 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
-section {
-  width: 45%;
-  float: left;
+<style lang="less" scoped>
+article {
+  display: flex;
 }
 
-article {
-  overflow: hidden;
+section {
+  width: 45%;
 }
 </style>
diff --git a/one/docs/demo/ui.vue b/one/docs/demo/ui.vue
index 56f7b01..c437d18 100644
--- a/one/docs/demo/ui.vue
+++ b/one/docs/demo/ui.vue
@@ -19,14 +19,12 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
+<style lang="less" scoped>
 .veui-button {
   width: 120px;
   margin-right: 1em;
 }
-</style>
 
-<style lang="less" scoped>
 .veui-button[ui~="secondary"] {
   background-color: #e5e5ff;
 
diff --git a/one/docs/demo/uploader/file.vue b/one/docs/demo/uploader/file.vue
index fb8ff96..b6ce34d 100644
--- a/one/docs/demo/uploader/file.vue
+++ b/one/docs/demo/uploader/file.vue
@@ -45,13 +45,12 @@ export default {
 }
 </script>
 
-<style lang="less" scoped docs>
-section {
-  width: 45%;
-  float: left;
+<style lang="less" scoped>
+article {
+  display: flex;
 }
 
-article {
-  overflow: hidden;
+section {
+  width: 45%;
 }
 </style>
diff --git a/one/docs/directives/v-drag.md b/one/docs/directives/v-drag.md
index 8dbf575..2dd1dd6 100644
--- a/one/docs/directives/v-drag.md
+++ b/one/docs/directives/v-drag.md
@@ -18,7 +18,7 @@
 
 [[ demo src="/demo/directives/drag/targets.vue" ]]
 
-### 限制拖动方向。
+### 限制拖动方向
 
 [[ demo src="/demo/directives/drag/axis.vue" ]]