Merge pull request #110 from uxsi/more

weui-wxss v2.0.0

.gitignore

@@ -2,4 +2,5 @@
 *~
 .idea
 node_modules
-npm-debug.log
+npm-debug.log
+.DS_Store

CHANGELOG.md

@@ -1,3 +1,16 @@
+#### v 2.0.0 (2019-08-01)
+
+- 【同步weui】 颜色规范、字体大小规范、间距规范对齐微信7.0新视觉风格
+- 【同步weui】 更新weui-cell、weui-uploader、weui-article、weui-footer、weui-msg、weui-panel、weui-search-bar等组件的UI
+- 【增强】 增加组件 slideview 右滑操作 
+- 【增强】 增加组件 gallery 模拟原生全屏预览 
+- 【增强】 增加组件 loading 加载中 
+- 【增强】 增加组件 dialog 模拟原生弹窗 
+- 【增强】 增加组件 half-screen-dialog 半屏弹窗
+- 【增强】 增加组件 navigation-bar 模拟原生顶部导航条
+- 【增强】 增加组件 tabbar 模拟原生底部tab
+- 【优化】 废弃组件 navbar
+
 #### v 1.1.1 (2017-01-18)
 
 - 【同步weui】 增加扩展类.weui-loading_transparent
@@ -18,4 +31,4 @@
 
 初始发布
 
-- Initial release
+- Initial release

dist/app.json

@@ -1,49 +1,51 @@
 {
   "pages": [
     "example/index",
-
     "example/button/button",
     "example/list/list",
+    "example/slideview/slideview",
     "example/input/input",
     "example/slider/slider",
     "example/uploader/uploader",
-
     "example/article/article",
     "example/badge/badge",
     "example/flex/flex",
     "example/footer/footer",
     "example/gallery/gallery",
     "example/grid/grid",
     "example/icons/icons",
+    "example/loading/loading",
     "example/loadmore/loadmore",
     "example/panel/panel",
     "example/preview/preview",
     "example/progress/progress",
-
     "example/actionsheet/actionsheet",
+    "example/half-screen-dialog/half-screen-dialog",
     "example/dialog/dialog",
     "example/msg/msg",
+    "example/msg/msg_text",
+    "example/msg/msg_text_primary",
     "example/msg/msg_success",
     "example/msg/msg_fail",
     "example/picker/picker",
     "example/toast/toast",
-
-    "example/navbar/navbar",
+    "example/navigation-bar/navigation-bar",
     "example/tabbar/tabbar",
-
     "example/searchbar/searchbar"
   ],
   "window": {
     "navigationBarTextStyle": "black",
     "navigationBarTitleText": "WeUI for 小程序",
-    "navigationBarBackgroundColor": "#f8f8f8",
-    "backgroundColor": "#f8f8f8"
+    "navigationBarBackgroundColor": "#EDEDED",
+    "backgroundColor": "#EDEDED"
   },
   "networkTimeout": {
     "request": 10000,
     "connectSocket": 10000,
     "uploadFile": 10000,
     "downloadFile": 10000
   },
-  "debug": true
+  "style": "v2",
+  "debug": true,
+  "sitemapLocation": "sitemap42.json"
 }

dist/app.wxss

@@ -1,7 +1,7 @@
 @import 'style/weui.wxss';
 
 page{
-    background-color: #F8F8F8;
+    background-color: #EDEDED;
     font-size: 16px;
     font-family: -apple-system-font,Helvetica Neue,Helvetica,sans-serif;
 }
@@ -17,10 +17,13 @@ page{
 }
 
 .page__ft{
-    padding-bottom: 10px;
     text-align: center;
+    padding:0 0 10px;
+    padding:0 0 calc(10px + constant(safe-area-inset-bottom));
+    padding:0 0 calc(10px + env(safe-area-inset-bottom));
 }
 
+
 .page__title {
     text-align: left;
     font-size: 20px;
@@ -32,4 +35,7 @@ page{
     color: #888888;
     text-align: left;
     font-size: 14px;
-}
+}
+.weui-cell_example:before{
+    left:52px;
+}

dist/example/actionsheet/actionsheet.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

dist/example/actionsheet/actionsheet.wxml

@@ -5,7 +5,7 @@
     </view>
     <view class="page__bd">
         <view class="weui-btn-area">
-            <button type="default" bindtap="open">ActionSheet</button>
+            <button class="weui-btn" type="default" bindtap="open">ActionSheet</button>
         </view>
     </view>
-</view>
+</view>

dist/example/article/article.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

dist/example/article/article.wxml

@@ -7,7 +7,7 @@
         <view class="weui-article">
             <view class="weui-article__h1">大标题</view>
             <view class="weui-article__section">
-                <view class="weui-article__title">章标题</view>
+                <view class="weui-article__h2">章标题</view>
                 <view class="weui-article__section">
                     <view class="weui-article__h3">1.1 节标题</view>
                     <view class="weui-article__p">
@@ -33,4 +33,4 @@
             </view>
         </view>
     </view>
-</view>
+</view>

dist/example/badge/badge.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

dist/example/badge/badge.wxss

@@ -0,0 +1 @@
+/* example/badge/badge.wxss */

dist/example/button/button.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

dist/example/button/button.wxml

@@ -4,25 +4,19 @@
         <view class="page__desc">按钮，WeUI采用小程序原生的按钮为主体，加入一些间距的样式。</view>
     </view>
     <view class="page__bd page__bd_spacing">
-        <button class="weui-btn" type="primary">页面主操作 Normal</button>
-        <button class="weui-btn" type="primary" disabled="true">页面主操作 Disabled</button>
+        <button class="weui-btn" type="primary">页面主操作</button>
+        <button class="weui-btn" type="primary" disabled="true">页面主操作</button>
 
-        <button class="weui-btn" type="default">页面次要操作 Normal</button>
-        <button class="weui-btn" type="default" disabled="true">页面次要操作 Disabled</button>
+        <button class="weui-btn" type="default">页面次要操作</button>
+        <button class="weui-btn" type="default" disabled="true">页面次要操作</button>
 
-        <button class="weui-btn" type="warn">警告类操作 Normal</button>
-        <button class="weui-btn" type="warn" disabled="true">警告类操作 Disabled</button>
+        <button class="weui-btn" type="warn">警告类操作</button>
+        <button class="weui-btn" type="warn" disabled="true">警告类操作</button>
 
         <view class="button-sp-area">
-            <button class="weui-btn" type="primary" plain="true">按钮</button>
-            <button class="weui-btn" type="primary" disabled="true" plain="true">按钮</button>
-
-            <button class="weui-btn" type="default" plain="true">按钮</button>
-            <button class="weui-btn" type="default" disabled="true" plain="true">按钮</button>
-
             <button class="weui-btn mini-btn" type="primary" size="mini">按钮</button>
             <button class="weui-btn mini-btn" type="default" size="mini">按钮</button>
             <button class="weui-btn mini-btn" type="warn" size="mini">按钮</button>
         </view>
     </view>
-</view>
+</view>

dist/example/button/button.wxss

@@ -1,8 +1,9 @@
+page{background-color:#EDEDED;}
 .button-sp-area{
     margin: 0 auto;
     padding-top: 15px;
-    width: 60%;
+    text-align:center;
 }
 .mini-btn{
-    margin-right: 5px;
-}
+    margin: 0 4px;
+}

dist/example/dialog/dialog.js

@@ -1,5 +1,8 @@
 Page({
-    openConfirm: function () {
+    data: {
+        showDialog: false
+    },
+     openConfirm: function () {
         wx.showModal({
             title: '弹窗标题',
             content: '弹窗内容，告知当前状态、信息和解决方法，描述文字尽量控制在三行内',
@@ -15,15 +18,14 @@ Page({
             }
         });
     },
-    openAlert: function () {
-        wx.showModal({
-            content: '弹窗内容，告知当前状态、信息和解决方法，描述文字尽量控制在三行内',
-            showCancel: false,
-            success: function (res) {
-                if (res.confirm) {
-                    console.log('用户点击确定')
-                }
-            }
-        });
+    openDialog: function () {
+        this.setData({
+            istrue: true
+        })
+    },
+    closeDialog: function () {
+        this.setData({
+            istrue: false
+        })
     }
-});
+});

dist/example/dialog/dialog.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

dist/example/dialog/dialog.wxml

@@ -1,12 +1,29 @@
 <view class="page">
     <view class="page__hd">
         <view class="page__title">Dialog</view>
-        <view class="page__desc">对话框，采用小程序原生的modal</view>
+        <view class="page__desc">对话框</view>
     </view>
     <view class="page__bd">
         <view class="weui-btn-area">
-            <button class="weui-btn" type="default" bindtap="openConfirm">Confirm Dialog</button>
-            <button class="weui-btn" type="default" bindtap="openAlert">Alert Dialog</button>
+            <button class="weui-btn" type="default" bindtap="openConfirm">原生 Dialog</button>
+            <button class="weui-btn" type="default" bindtap="openDialog">模拟 Dialog</button>
+        </view>
+        <view class="weui-demo-dialog {{istrue ? 'weui-demo-dialog_show' : ''}}">
+          <view class="weui-mask" bindtap="closeDialog"></view>
+          <view class="weui-dialog__wrp" bindtap="closeDialog">
+              <view class="weui-dialog" catchtap="stopEvent">
+                <view class="weui-dialog__hd">
+                  <view class="weui-dialog__title">标题</view>
+                </view>
+                <view class="weui-dialog__bd">
+                  <image class="weui-article__img" src="../images/pic_article.png" mode="aspectFill" style="max-width:100%;"/>
+                </view>
+                <view class="weui-dialog__ft">
+                    <view class="weui-dialog__btn weui-dialog__btn_default" bindtap="closeDialog">取消</view>
+                    <view class="weui-dialog__btn" bindtap="closeDialog">确定</view>
+                </view>
+              </view>
+          </view>
         </view>
     </view>
-</view>
+</view>

dist/example/dialog/dialog.wxss

@@ -1,3 +1,12 @@
 page{
     background-color: #FFFFFF;
-}
+}
+.weui-demo-dialog{
+  visibility:hidden;
+  opacity:0;
+  transition:opacity .3s;
+}
+.weui-demo-dialog_show{
+  visibility:visible;
+  opacity:1;
+}

dist/example/flex/flex.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

dist/example/flex/flex.wxss

@@ -2,8 +2,8 @@
     margin: 5px;
     padding: 0 10px;
     text-align: center;
-    background-color: #EBEBEB;
+    background-color: #F7F7F7;
     height: 2.3em;
     line-height: 2.3em;
-    color: #cfcfcf;
-}
+    color: rgba(0,0,0,.3);
+}

dist/example/footer/footer.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

dist/example/gallery/gallery.js

@@ -1 +1,12 @@
-Page({});
+Page({
+    openGallery: function () {
+        this.setData({
+            istrue: true
+        })
+    },
+    closeGallery: function () {
+        this.setData({
+            istrue: false
+        })
+    }
+});

dist/example/gallery/gallery.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

dist/example/gallery/gallery.wxml

@@ -1,6 +1,20 @@
 <view class="page">
     <view class="page__hd">
         <view class="page__title">Gallery</view>
-        <view class="page__desc">画廊，建议采用小程序原生的wx.previewImage来实现。详情请看小程序文档。</view>
+        <view class="page__desc">画廊，模拟小程序原生的wx.previewImage。</view>
     </view>
-</view>
+    <view class="page__bd">
+      <view class="weui-btn-area">
+          <button class="weui-btn" type="default" bindtap="openGallery">Gallery</button>
+      </view>
+      <view class="weui-gallery {{istrue ? 'weui-gallery_show' : ''}}" bindtap="closeGallery">
+        <view class="weui-gallery__info">1/17</view>
+        <view class="weui-gallery__img__wrp">
+              <image mode="aspectFit" class="weui-gallery__img" src="../images/pic_160.png"></image>
+        </view>
+        <view class="weui-gallery__opr">
+          <navigator href="javascript:" class="weui-gallery__del">删除</navigator>
+        </view>
+      </view>
+    </view>
+</view>

dist/example/gallery/gallery.wxss

@@ -0,0 +1 @@
+/* example/gallery/gallery.wxss */

dist/example/grid/grid.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

dist/example/grid/grid.wxss

@@ -0,0 +1 @@
+/* example/grid/grid.wxss */