更新组件演示页面，方便用户直接使用组件，去除tn-button的默认背景色，tn-avatar修改参数默认值，修复tn-avatar-group最开始头像进行了偏移、修复无法使用标签的bug，tn-badge修改参数默认值，tn-collapse-item修复背景颜色失效问题，滚动通知移除默认背景颜色和字体大小，tn-count-down修复时间单位不正确问题，列表组件修复背景颜色问题，tn-nav-bar返回按钮修改为可进行修改的图标，tn-step添加点击步骤进行跳转，tn-loading修复默认激活颜色出错问题，tn-tag移除默认背景颜色，优化阴影大小css

basicPage/shadow/shadow.vue

@@ -1,6 +1,6 @@
 <template>
 
-  <view class="basic-shadow">
+  <view class="basic-shadow tn-safe-area-inset-bottom">
 
     <!-- 顶部自定义导航 -->
     <tn-nav-bar fixed>阴影</tn-nav-bar>
@@ -8,20 +8,27 @@
     <!-- 页面内容 -->
     <view :style="{paddingTop: vuex_custom_bar_height + 'px'}">
       
-      <dynamic-demo-template ref="demoTemplate" :tips="tips" :sectionList="sectionList" :full="true" @click="click">
-        <block v-if="shadowType === 'bg'">
-          <view
-            class="shadow-content"
-            :class="[shadowClass]"
-          ></view>
-        </block>
-        <block v-else>
-          <view
-            class="shadow-image tn-shadow-blur"
-          ></view>
-        </block>
-        <view style="visibility: hidden;height: 1px;">tuniao</view>
-      </dynamic-demo-template>
+      <demo-title title="普通阴影">
+        <view class="shadow-content tn-shadow"></view>
+        <view class="shadow-content tn-shadow-warp"></view>
+      </demo-title>
+      
+      <demo-title title="有色阴影">
+        <view class="shadow-content tn-bg-teal tn-shadow-teal"></view>
+        <view class="shadow-content tn-bg-indigo tn-shadow-indigo"></view>
+      </demo-title>
+      
+      <demo-title title="背景图片阴影">
+        <view class="shadow-content shadow-content__image tn-shadow-blur"></view>
+      </demo-title>
+      
+      <demo-title title="文字阴影">
+        <view class="shadow-content__text tn-color-indigo tn-text-shadow-indigo">
+          图鸟UI，专注UI开发
+        </view>
+      </demo-title>
+      
+      <view class="tn-padding-bottom-lg"></view>
 
     </view>
 
@@ -30,89 +37,43 @@
 </template>
 
 <script>
-  import dynamicDemoTemplate from '@/libs/components/dynamic-demo-template.vue'
+  import demoTitle from '@/libs/components/demo-title.vue'
   export default {
     name: 'basicShadow',
-    components: {dynamicDemoTemplate},
+    components: {demoTitle},
     data() {
       return {
-        shadowType: 'bg',
-        shadowColor: '',
-        shadowWarp: false,
-        
-        tips: ['无需依赖额外的样式文件','不使用任何组件'],
-        sectionList: [
-          {
-            name: '参数切换',
-            section: [
-              {
-                title: '样式',
-                optional: ['背景阴影','图片阴影'],
-                methods: 'typeChange'
-              },
-              {
-                title: '颜色',
-                optional: ['默认','自定义'],
-                methods: 'colorChange'
-              }
-            ]
-          }
-        ]
-      }
-    },
-    computed: {
-      shadowClass() {
-        let clazz = ''
-        if (this.shadowType === 'bg') {
-          if (this.shadowWarp) {
-            clazz += ` tn-shadow-warp`
-          } else {
-            if (this.shadowColor === '') {
-              clazz += ` tn-shadow`
-            } else {
-              clazz += ` ${this.shadowColor}`
-            }
-          }
-        }
-        
-        return clazz
       }
     },
     methods: {
-      click(event) {
-        this[event.methods] && this[event.methods](event)
-      },
-      // 切换阴影样式
-      typeChange(event) {
-        this.shadowType = event.index === 0 ? 'bg' : 'image'
-      },
-      // 切换阴影颜色
-      colorChange(event) {
-        this.shadowColor = event.index === 0 ? '' : 'tn-shadow-red'
-      }
-
-    },
+    }
 
   }
 </script>
 
 <style lang="scss" scoped>
   
-  .shadow-content {
-    width: 80%;
-    height: 80rpx;
-    background-color: $tn-font-holder-color;
-    margin: 0 auto;
+  .basic-shadow {
+    background-color: $tn-bg-gray-color;
+    min-height: 100vh;
   }
   
-  .shadow-image {
-    width: 80%;
+  .shadow-content {
     height: 80rpx;
-    margin: 0 auto;
-    z-index: 1;
-    background-image: url(https://vkceyugu.cdn.bspapp.com/VKCEYUGU-7207d16b-b9c3-4105-8d0d-e9e0c7785f66/605563a1-a210-42f3-99e4-8de3c655c59e.jpg);
-    background-size: cover;
-    background-position: top;
-    background-repeat: no-repeat;
+    background-color: #FFFFFF;
+    margin: 30rpx 0;
+    
+    &__image {
+      z-index: 1;
+      background-image: url(https://vkceyugu.cdn.bspapp.com/VKCEYUGU-7207d16b-b9c3-4105-8d0d-e9e0c7785f66/605563a1-a210-42f3-99e4-8de3c655c59e.jpg);
+      background-size: cover;
+      background-position: top;
+      background-repeat: no-repeat;
+    }
+    
+    &__text {
+      font-size: 60rpx;
+      text-align: center;
+    }
   }
 </style>