weui-wxss

GitHub

A UI library by WeChat official design team, includes the most useful widgets/modules.

15,279 stars Less #weui#wxss
RAW Doc

Repository: Tencent/weui-wxss


Stars: 15273

README.md

WeUI for 小程序 为微信小程序量身设计
=====

![npm version](https://www.npmjs.org/package/weui-wxss)
![Gitter](https://gitter.im/weui/weui?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge)

概述

WeUI 是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信内网页和微信小程序量身设计,令用户的使用感知更加统一。包含buttoncelldialogprogresstoastarticleactionsheeticon等各式元素。

以下内容是纯UI库,如果想使用逻辑封装版本,请看小程序组件库 - WeUI


使用

- 样式文件可直接引用dist/style/weui.wxss,或者单独引用dist/style/widget下的组件的wxss
- 组件的wxml结构请看dist/example/下的组件

rpx版本


默认版本使用的是px。这里也提供rpx版本,文件在dist-rpx-mode目录下。


WeUI 黑暗模式


在根结点增加属性 data-weui-theme="dark"
如:
html
<view data-weui-theme="dark">
...
</view>

预览


微信web开发者工具打开dist目录(请注意,是dist目录,不是整个项目

<img src='https://cloud.githubusercontent.com/assets/2395166/20168869/48a75b02-a75f-11e6-89aa-503d65c8ad8e.png' width='344' alt='preview' />

!WeUI for 小程序


文档

WeUI 视觉标准参考 weui-design


License


The MIT License(http://opensource.org/licenses/MIT)

请自由地享受和参与开源


贡献

如果你有好的意见或建议,欢迎给我们提issue或pull request。