feat: weui-wxss 2.0

Author: uxsi

CHANGELOG.md

@@ -1,26 +1,26 @@
 {
   "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",
@@ -29,23 +29,23 @@
     "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"
+}

DIFF.md

@@ -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;

LICENSE.txt

@@ -14,12 +14,6 @@
         <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>

README.md

@@ -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/app.js

@@ -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/app.json

@@ -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/app.wxss

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

dist/example/actionsheet/actionsheet.js

@@ -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/actionsheet/actionsheet.wxml

@@ -5,25 +5,25 @@ Page({
                 id: 'form',
                 name: '表单',
                 open: false,
-                pages: ['button', 'list', 'input', 'slider', 'uploader']
+                pages: ['button', 'list', 'slideview', 'input', 'slider', 'uploader']
             },
             {
                 id: 'widget',
                 name: '基础组件',
                 open: false,
-                pages: ['article', 'badge', 'flex', 'footer', 'gallery', 'grid', 'icons', 'loadmore', 'panel', 'preview', 'progress']
+                pages: ['article', 'badge', 'flex', 'footer', 'gallery', 'grid', 'icons', 'loading', 'loadmore', 'panel', 'preview', 'progress']
             },
             {
                 id: 'feedback',
                 name: '操作反馈',
                 open: false,
-                pages: ['actionsheet', 'dialog', 'msg', 'picker', 'toast']
+                pages: ['actionsheet', 'dialog', 'half-screen-dialog', 'msg', 'picker', 'toast']
             },
             {
                 id: 'nav',
                 name: '导航相关',
                 open: false,
-                pages: ['navbar', 'tabbar']
+                pages: ['navigation-bar', 'tabbar']
             },
             {
                 id: 'search',

dist/example/actionsheet/actionsheet.wxss

@@ -1,5 +1,5 @@
 /*!
- * WeUI v1.1.1 (https://github.com/weui/weui-wxss)
+ * WeUI v2.0.0 (https://github.com/weui/weui-wxss)
  * Copyright 2019 Tencent, Inc.
  * Licensed under the MIT license
  */

dist/example/article/article.js

@@ -24,7 +24,7 @@
         </view>
 
         <view class="weui-cells__title">复选列表项</view>
-        <view class="weui-cells weui-cells_after-title">
+        <view class="weui-cells weui-cells_checkbox weui-cells_after-title">
             <checkbox-group bindchange="checkboxChange">
                 <label class="weui-cell weui-check__label" wx:for="{{checkboxItems}}" wx:key="value">
                     <checkbox class="weui-check" value="{{item.value}}" checked="{{item.checked}}"/>
@@ -43,15 +43,15 @@
 
         <view class="weui-cells__title">表单</view>
         <view class="weui-cells weui-cells_after-title">
-            <view class="weui-cell weui-cell_input">
+            <view class="weui-cell ">
                 <view class="weui-cell__hd">
                     <view class="weui-label">qq</view>
                 </view>
                 <view class="weui-cell__bd">
                     <input class="weui-input" placeholder="请输入qq"/>
                 </view>
             </view>
-            <view class="weui-cell weui-cell_input weui-cell_vcode">
+            <view class="weui-cell  weui-cell_vcode">
                 <view class="weui-cell__hd">
                     <view class="weui-label">手机号</view>
                 </view>
@@ -62,7 +62,7 @@
                     <view class="weui-vcode-btn">获取验证码</view>
                 </view>
             </view>
-            <view class="weui-cell weui-cell_input">
+            <view class="weui-cell ">
                 <view class="weui-cell__hd">
                     <view class="weui-label">日期</view>
                 </view>
@@ -72,7 +72,7 @@
                     </picker>
                 </view>
             </view>
-            <view class="weui-cell weui-cell_input">
+            <view class="weui-cell ">
                 <view class="weui-cell__hd">
                     <view class="weui-label">时间</view>
                 </view>
@@ -82,7 +82,7 @@
                     </picker>
                 </view>
             </view>
-            <view class="weui-cell weui-cell_input weui-cell_vcode">
+            <view class="weui-cell  weui-cell_vcode">
                 <view class="weui-cell__hd">
                     <view class="weui-label">验证码</view>
                 </view>
@@ -98,7 +98,7 @@
 
         <view class="weui-cells__title">表单报错</view>
         <view class="weui-cells weui-cells_after-title">
-            <view class="weui-cell weui-cell_input weui-cell_warn">
+            <view class="weui-cell  weui-cell_warn">
                 <view class="weui-cell__hd">
                     <view class="weui-label">卡号</view>
                 </view>
@@ -123,7 +123,7 @@
 
         <view class="weui-cells__title">文本框</view>
         <view class="weui-cells weui-cells_after-title">
-            <view class="weui-cell weui-cell_input">
+            <view class="weui-cell ">
                 <view class="weui-cell__bd">
                     <input class="weui-input" placeholder="请输入文本" />
                 </view>
@@ -191,4 +191,4 @@
             <button class="weui-btn" type="primary" bindtap="showTopTips">确定</button>
         </view>
     </view>
-</view>
+</view>