[Doc] update mobile nav

example/pages/dashboard/config.js

@@ -3,50 +3,60 @@ export default {
     title: '基础组件',
     content: [
       {
-        name: 'Badge 徽章',
-        path: '/pages/badge/index'
-      }, {
-        name: 'Button 按钮',
-        path: '/pages/button/index'
-      }, {
-        name: 'Card 卡片',
-        path: '/pages/card/index'
-      }, {
-        name: 'Cell 单元格',
-        path: '/pages/cell/index'
-      }, {
-        name: 'Helper 基础样式',
-        path: '/pages/helper/index'
-      }, {
-        name: 'Icon 图标',
-        path: '/pages/icon/index'
-      }, {
         name: 'Layout 布局',
         path: '/pages/layout/index'
-      }, {
-        name: 'loading 加载',
+      },
+      {
+        name: 'Base 基础样式',
+        path: '/pages/helper/index'
+      },
+      {
+        name: 'Badge 徽章',
+        path: '/pages/badge/index'
+      },
+      {
+        name: 'Button 按钮',
+        path: '/pages/button/index'
+      },
+      {
+        name: 'Cell 单元格',
+        path: '/pages/cell/index'
+      },
+      {
+        name: 'Icon 图标',
+        path: '/pages/icon/index'
+      },
+      {
+        name: 'Loading 加载',
         path: '/pages/loading/index'
-      }, {
-        name: 'NoticeBar 通告栏',
-        path: '/pages/notice-bar/index'
-      }, {
-        name: 'Panel 面板',
-        path: '/pages/panel/index'
-      }, {
-        name: 'Popup 弹出层',
-        path: '/pages/popup/index'
-      }, {
-        name: 'Steps 步骤条',
-        path: '/pages/steps/index'
-      }, {
-        name: 'Tab 标签',
-        path: '/pages/tab/index'
-      }, {
-        name: 'Tag 标记',
-        path: '/pages/tag/index'
-      }, {
+      },
+      {
         name: 'Loadmore 加载更多',
         path: '/pages/loadmore/index'
+      },
+      {
+        name: 'NoticeBar 通告栏',
+        path: '/pages/notice-bar/index'
+      },
+      {
+        name: 'Panel 面板',
+        path: '/pages/panel/index'
+      },
+      {
+        name: 'Popup 弹出层',
+        path: '/pages/popup/index'
+      },
+      {
+        name: 'Steps 步骤条',
+        path: '/pages/steps/index'
+      },
+      {
+        name: 'Tab 标签',
+        path: '/pages/tab/index'
+      },
+      {
+        name: 'Tag 标记',
+        path: '/pages/tag/index'
       }
     ]
   },
@@ -56,22 +66,24 @@ export default {
       {
         name: 'Checkbox 复选框',
         path: '/pages/checkbox/index'
-      }, {
-        name: 'Datetime 时间选择器',
-        path: '/pages/datetime/index'
-      }, {
+      },
+      {
         name: 'Field 输入框',
         path: '/pages/field/index'
-      }, {
+      },
+      {
         name: 'Radio 单选框',
         path: '/pages/radio/index'
-      }, {
+      },
+      {
         name: 'Search 搜索',
         path: '/pages/search/index'
-      }, {
+      },
+      {
         name: 'Stepper 步进器',
         path: '/pages/stepper/index'
-      }, {
+      },
+      {
         name: 'Switch 开关',
         path: '/pages/switch/index'
       }
@@ -83,16 +95,32 @@ export default {
       {
         name: 'Actionsheet 上拉菜单',
         path: '/pages/actionsheet/index'
-      }, {
+      },
+      {
         name: 'Dialog 弹出框',
         path: '/pages/dialog/index'
-      }, {
+      },
+      {
+        name: 'DatetimePicker 时间选择器',
+        path: '/pages/datetime/index'
+      },
+      {
         name: 'Toast 轻提示',
         path: '/pages/toast/index'
-      }, {
+      },
+      {
         name: 'TopTips 顶部提示',
         path: '/pages/toptips/index'
       }
     ]
+  },
+  bussiness: {
+    title: '业务组件',
+    content: [
+      {
+        name: 'Card 卡片',
+        path: '/pages/card/index'
+      }
+    ]
   }
 };

example/pages/dashboard/index.js

@@ -3,12 +3,5 @@ import componentsConfig from './config';
 Page({
   data: {
     list: componentsConfig
-  },
-
-  onLoad: function () {
-
-  },
-
-  onShow: function() {
-  },
-})
+  }
+});

example/pages/dashboard/index.wxml

@@ -5,17 +5,19 @@
   </view>
   <view class="desc">轻量、可靠的小程序 UI 组件库</view>
 
-  <block wx:for="{{ list }}" wx:for-item="group" wx:key="title">
-    <van-panel title="{{ group.title }}">
+  <block wx:for="{{ list }}" wx:for-item="group" wx:key="group.title">
+    <view class="mobile-nav">
+      <view class="mobile-nav__title">{{ group.title }}</view>
       <van-cell-group>
         <van-cell
           wx:for="{{ group.content }}"
           wx:key="name"
           is-link
+          title-width="200px"
           url="{{ item.path }}"
           title="{{ item.name }}"
         ></van-cell>
       </van-cell-group>
-    </van-panel>
+    </view>
   </block>
 </view>

example/pages/dashboard/index.wxss

@@ -1,5 +1,5 @@
 .container {
-  padding-top: 45px;
+  padding: 45px 15px 0;
 }
 
 .title {
@@ -29,6 +29,16 @@
 .desc {
   font-size: 14px;
   color: #455a64;
-  margin: 0 0 20px;
+  margin: 0 0 60px;
   text-align: center;
 }
+
+.mobile-nav {
+  margin-bottom: 20px;
+}
+
+.mobile-nav__title {
+  font-size: 16px;
+  background-color: #fff;
+  padding: 17px 15px;
+}

example/pages/layout/index.wxml

@@ -1,4 +1,4 @@
-<demo-block title="基础用法">
+<demo-block title="基础用法" padding>
   <van-row>
     <van-col span="8" custom-class="dark">span: 8</van-col>
     <van-col span="8" custom-class="light">span: 8</van-col>
@@ -15,7 +15,7 @@
   </van-row>
 </demo-block>
 
-<demo-block title="在列元素之间增加间距">
+<demo-block title="在列元素之间增加间距" padding>
   <van-row gutter="20">
     <van-col span="8" custom-class="dark">span: 8</van-col>
     <van-col span="8" custom-class="light">span: 8</van-col>

packages/cell/index.wxml

@@ -5,7 +5,7 @@
   <van-icon wx:if="{{ icon }}" custom-class="van-cell__left-icon left-icon-class" name="{{ icon }}" />
   <slot wx:else name="icon" />
 
-  <view wx:if="{{ title }}" class="van-cell__title title-class" style="{{ titleWidth ? 'max-width: ' + titleWidth : '' }}">
+  <view wx:if="{{ title }}" class="van-cell__title title-class" style="{{ titleWidth ? 'max-width: ' + titleWidth + ';min-width: ' + titleWidth : '' }}">
     {{ title }}
     <view wx:if="{{ label }}" class="van-cell__label label-class">{{ label }}</view>
   </view>