add new decoration

src/components/decoration6/index.vue

@@ -0,0 +1,20 @@
+<template>
+  <div class="decoration-6">
+    <img src="./img/decoration.gif" />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Decoration6'
+}
+</script>
+
+<style lang="less">
+.decoration-6 {
+
+  img {
+    width: 100%;
+  }
+}
+</style>

src/components/index.js

@@ -11,6 +11,7 @@ import decoration2 from './decoration2/index'
 import decoration3 from './decoration3/index'
 import decoration4 from './decoration4/index'
 import decoration5 from './decoration5/index'
+import decoration6 from './decoration6/index'
 import loading from './loading/index.vue'
 
 import capsuleChart from './capsuleChart/index.vue'
@@ -39,6 +40,7 @@ export default function (Vue) {
   Vue.component('decoration3', decoration3)
   Vue.component('decoration4', decoration4)
   Vue.component('decoration5', decoration5)
+  Vue.component('decoration6', decoration6)
   Vue.component('loading', loading)
 
   Vue.component('capsuleChart', capsuleChart)

src/views/demo/decoration.vue

@@ -50,13 +50,21 @@
     </border-box-7>
 
     <border-box-7 class="decoration-container">
-      <decoration-5 class="decoration d4r center" :reverse="true" />
+      <decoration-5 class="decoration d4r center" />
       <div class="title">Decoration-5</div>
       <highlight-code>
 &lt;decoration-5 /&gt;
       </highlight-code>
     </border-box-7>
 
+    <border-box-7 class="decoration-container">
+      <decoration-6 class="decoration d4r center" />
+      <div class="title">Decoration-6</div>
+      <highlight-code>
+&lt;decoration-6 /&gt;
+      </highlight-code>
+    </border-box-7>
+
     <border-box-7 class="decoration-container">
       <loading class="decoration center" />
       <div class="title">Loading</div>