blackteay/vant-weapp
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant-weapp.git synced 2025-04-05 10:22:44 +08:00
Code Issues Projects Releases Wiki Activity

[new feature] 增加 css 编译，方便组件书写 (#40)

Browse Source 
* add src dir && add build

* add build watch && change dir name

* bower ignore package.json
This commit is contained in:
Yao 2017-10-29 10:42:28 +08:00 committed by GitHub
parent 778be1d2c4
commit 451a3b19fc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
80 changed files with 1897 additions and 1295 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.eslintrc
View File

@ -38,6 +38,7 @@
"no-unused-expressions": 0,
"no-underscore-dangle": 0,
"no-use-before-define": 0,
"no-new": 0
"no-new": 0,
"import/no-extraneous-dependencies": 0
}
}

10
bower.json
View File

@ -11,10 +11,14 @@
"homepage": "",
"ignore": [
"**/.*",
"example",
"build",
"assets",
".github",
"assets",
"build",
"example",
"node_modules",
"packages",
"postcss.config.js",
"package.json",
"app.*",
"*.md",
"*.log"

7
build/build-components.js Normal file
View File

@ -0,0 +1,7 @@
const path = require('path');
const extracter = require('./utils/extracter');
extracter({
src: path.resolve(__dirname, '../packages'),
dist: path.resolve(__dirname, '../dist')
});

12
build/build-css.js Normal file
View File

@ -0,0 +1,12 @@
const gulp = require('gulp');
const postcss = require('gulp-postcss');
const cssmin = require('gulp-clean-css');
gulp.task('compile', () => {
return gulp.src('../packages/**/*.wxss')
.pipe(postcss())
.pipe(cssmin())
.pipe(gulp.dest('../dist'));
});
gulp.task('build', ['compile']);

8
build/build-dev.js Normal file
View File

@ -0,0 +1,8 @@
const path = require('path');
const extracter = require('./utils/extracter');
extracter({
src: path.resolve(__dirname, '../packages'),
dist: path.resolve(__dirname, '../dist'),
watch: true
});

4
build/build-icon.sh
View File

@ -27,7 +27,7 @@ fi
# generate fontface style
eot=$(fontname eot)
cat > $basepath/../dist/icon/index.wxss <<EOF
cat > $basepath/../src/icon/index.wxss <<EOF
/* DO NOT EDIT! Generated by fount */
@font-face {
@ -75,4 +75,4 @@ cat > $basepath/../dist/icon/index.wxss <<EOF
}
EOF
cat $basepath/../assets/icons/build/css/zanui-weapp-icon-codes.css >> $basepath/../dist/icon/index.wxss
cat $basepath/../assets/icons/build/css/zanui-weapp-icon-codes.css >> $basepath/../src/icon/index.wxss

7
build/release.sh
View File

@ -11,6 +11,13 @@ if [[ $REPLY =~ ^[Yy]$ ]]
then
echo "Releasing $VERSION ..."
# build
npm run components
# commit build
git add -A
git commit -m "[build] $VERSION"
# commit
npm version $VERSION --message "[release] $VERSION"

26
build/utils/extracter.js Normal file
View File

@ -0,0 +1,26 @@
const fs = require('fs-extra');
const nodeWatch = require('node-watch');
require('shelljs/global');
module.exports = function (config = {}) {
// 清空 dist 目录
fs.emptyDirSync(config.dist);
if (config.watch) {
extracter(config);
nodeWatch(config.src, { recursive: true }, () => extracter(config));
} else {
extracter(config);
}
};
function extracter(config = {}) {
// 复制 src
fs.copySync(config.src, config.dist);
// js 无需编译，让微信开发者工具处理
// 编译 wxss 文件
exec('npm run css');
}

25
dist/badge/index.wxss vendored
View File

@ -1,24 +1 @@
.zan-badge {
position: relative;
}
.zan-badge__count {
position: absolute;
top: -8px;
right: 0px;
height: 1.6em;
min-width: 1.6em;
line-height: 1.6;
padding: 0 .4em;
font-size: 10px;
font-family: tahoma;
border-radius: .8em;
background: #FF4444;
color: #fff;
text-align: center;
white-space: nowrap;
transform: translateX(50%);
transform-origin: -10% center;
z-index: 10;
box-shadow: 0 0 0 1px #fff;
box-sizing: border-box;
}
.zan-badge{position:relative}.zan-badge__count{position:absolute;top:-8px;right:0;height:1.6em;min-width:1.6em;line-height:1.6;padding:0 .4em;font-size:10px;font-family:tahoma;border-radius:.8em;background:#f44;color:#fff;text-align:center;white-space:nowrap;transform:translateX(50%);transform-origin:-10% center;z-index:10;box-shadow:0 0 0 1px #fff;box-sizing:border-box}

143
dist/btn/index.wxss vendored
View File

@ -1,142 +1 @@
.zan-btn {
position: relative;
color: #333;
background-color: #fff;
margin-bottom: 10px;
padding-left: 15px;
padding-right: 15px;
border-radius: 2px;
border: 1rpx solid #e5e5e5;
font-size: 16px;
line-height: 45px;
height: 45px;
box-sizing: border-box;
text-decoration: none;
text-align: center;
vertical-align: middle;
}
.zan-btn::after {
display: none;
}
.zan-btns {
margin: 15px;
}
/* type */
.zan-btn--primary {
color: #fff;
background-color: #4b0;
border-color: #0a0;
}
.zan-btn--warn {
color: #fff;
background-color: #f85;
border-color: #f85;
}
.zan-btn--danger {
color: #fff;
background-color: #f44;
border-color: #e33;
}
/* size */
.zan-btn--small {
display: inline-block;
height: 30px;
line-height: 30px;
font-size: 12px;
margin-right: 5px;
margin-bottom: 0;
}
.zan-btn--mini {
display: inline-block;
line-height: 21px;
height: 22px;
font-size: 10px;
margin-right: 5px;
margin-bottom: 0;
padding-left: 5px;
padding-right: 5px;
}
.zan-btn--large {
border-radius: 0;
margin-bottom: 0;
border: none;
line-height: 50px;
height: 50px;
}
/* plain */
.zan-btn--plain.zan-btn {
background-color: transparent;
}
.zan-btn--plain.zan-btn--primary {
color: #06BF04;
}
.zan-btn--plain.zan-btn--warn {
color: #FF6600;
}
.zan-btn--plain.zan-btn--danger {
color: #FF4444;
}
/* 重写button组件的button-hover样式 */
.button-hover {
opacity: 0.9;
}
/* loading */
.zan-btn--loading {
color: transparent;
opacity: 1;
}
.zan-btn--loading::before {
position: absolute;
left: 50%;
top: 50%;
content: ' ';
width: 16px;
height: 16px;
margin-left: -8px;
margin-top: -8px;
border: 3px solid #e5e5e5;
border-color: #666 #e5e5e5 #e5e5e5 #e5e5e5;
border-radius: 8px;
box-sizing: border-box;
animation: btn-spin 0.6s linear;
animation-iteration-count: infinite;
}
.zan-btn--primary.zan-btn--loading::before,
.zan-btn--warn.zan-btn--loading::before,
.zan-btn--danger.zan-btn--loading::before {
border-color: #fff rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1);
}
@keyframes btn-spin {
0% {
transform: rotate(0);
}
100% {
transform: rotate(360deg);
}
}
/* disabled */
.zan-btn.zan-btn--disabled {
/* 防止样式被 button[disabled] 的规则覆盖，所以使用了important */
color: #999 ! important;
background: #f8f8f8 ! important;
border-color: #e5e5e5 ! important;
cursor: not-allowed ! important;
opacity: 1 ! important;
}
/* :last-child */
.zan-btn--last-child,
.zan-btn:last-child {
margin-bottom: 0;
margin-right: 0;
}
.zan-btn{position:relative;color:#333;background-color:#fff;margin-bottom:10px;padding-left:15px;padding-right:15px;border-radius:2px;border:1rpx solid #e5e5e5;font-size:16px;line-height:45px;height:45px;box-sizing:border-box;text-decoration:none;text-align:center;vertical-align:middle}.zan-btn::after{display:none}.zan-btns{margin:15px}.zan-btn--primary{color:#fff;background-color:#4b0;border-color:#0a0}.zan-btn--warn{color:#fff;background-color:#f85;border-color:#f85}.zan-btn--danger{color:#fff;background-color:#f44;border-color:#e33}.zan-btn--small{display:inline-block;height:30px;line-height:30px;font-size:12px;margin-right:5px;margin-bottom:0}.zan-btn--mini{display:inline-block;line-height:21px;height:22px;font-size:10px;margin-right:5px;margin-bottom:0;padding-left:5px;padding-right:5px}.zan-btn--large{border-radius:0;margin-bottom:0;border:none;line-height:50px;height:50px}.zan-btn--plain.zan-btn{background-color:transparent}.zan-btn--plain.zan-btn--primary{color:#06bf04}.zan-btn--plain.zan-btn--warn{color:#f60}.zan-btn--plain.zan-btn--danger{color:#f44}.button-hover{opacity:.9}.zan-btn--loading{color:transparent;opacity:1}.zan-btn--loading::before{position:absolute;left:50%;top:50%;content:' ';width:16px;height:16px;margin-left:-8px;margin-top:-8px;border:3px solid #e5e5e5;border-color:#666 #e5e5e5 #e5e5e5 #e5e5e5;border-radius:8px;box-sizing:border-box;animation:btn-spin .6s linear;animation-iteration-count:infinite}.zan-btn--danger.zan-btn--loading::before,.zan-btn--primary.zan-btn--loading::before,.zan-btn--warn.zan-btn--loading::before{border-color:#fff rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.1)}@keyframes btn-spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.zan-btn.zan-btn--disabled{color:#999!important;background:#f8f8f8!important;border-color:#e5e5e5!important;cursor:not-allowed!important;opacity:1!important}.zan-btn--last-child,.zan-btn:last-child{margin-bottom:0;margin-right:0}

40
dist/capsule/index.wxss vendored
View File

@ -1,39 +1 @@
.zan-capsule {
display: inline-block;
font-size: 12px;
vertical-align: middle;
line-height: 16px;
transform: scale(0.83);
}
.zan-capsule__left,
.zan-capsule__right {
display: inline-block;
line-height: 16px;
height: 16px;
vertical-align: middle;
box-sizing: border-box;
}
.zan-capsule__left {
padding: 0 2px;
color: #FFF;
background: #999;
border-radius: 2px 0 0 2px;
border: 1rpx solid #999;
}
.zan-capsule__right {
padding: 0 5px;
color: #999;
border-radius: 0 2px 2px 0;
border: 1rpx solid #999;
}
.zan-capsule--danger .zan-capsule__left {
color: #FFF;
background: #F24544;
border-color: #F24544;
}
.zan-capsule--danger .zan-capsule__right {
color: #F24544;
border-color: #F24544;
}
.zan-capsule{display:inline-block;font-size:12px;vertical-align:middle;line-height:16px;transform:scale(.83)}.zan-capsule__left,.zan-capsule__right{display:inline-block;line-height:16px;height:16px;vertical-align:middle;box-sizing:border-box}.zan-capsule__left{padding:0 2px;color:#fff;background:#999;border-radius:2px 0 0 2px;border:1rpx solid #999}.zan-capsule__right{padding:0 5px;color:#999;border-radius:0 2px 2px 0;border:1rpx solid #999}.zan-capsule--danger .zan-capsule__left{color:#fff;background:#f24544;border-color:#f24544}.zan-capsule--danger .zan-capsule__right{color:#f24544;border-color:#f24544}

54
dist/card/index.wxss vendored
View File

@ -1,53 +1 @@
.zan-card {
margin-left: 0px;
width: auto;
padding: 5px 15px;
overflow: hidden;
position: relative;
font-size: 14px;
}
.zan-card__thumb {
width: 90px;
height: 90px;
float: left;
position: relative;
margin-left: auto;
margin-right: auto;
overflow: hidden;
background-size: cover;
}
.zan-card__img {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
}
.zan-card__detail {
margin-left: 100px;
width: auto;
position: relative;
}
.zan-card__detail-row {
overflow: hidden;
line-height: 20px;
min-height: 20px;
margin-bottom: 3px;
}
.zan-card__right-col {
float: right;
}
.zan-card__left-col {
margin-right: 80px;
}
.zan-card{margin-left:0;width:auto;padding:5px 15px;overflow:hidden;position:relative;font-size:14px}.zan-card__thumb{width:90px;height:90px;float:left;position:relative;margin-left:auto;margin-right:auto;overflow:hidden;background-size:cover}.zan-card__img{position:absolute;top:0;left:0;right:0;bottom:0;width:auto;height:auto;max-width:100%;max-height:100%}.zan-card__detail{margin-left:100px;width:auto;position:relative}.zan-card__detail-row{overflow:hidden;line-height:20px;min-height:20px;margin-bottom:3px}.zan-card__right-col{float:right}.zan-card__left-col{margin-right:80px}

78
dist/cell/index.wxss vendored
View File

@ -1,77 +1 @@
.zan-cell {
position: relative;
padding: 12px 15px;
display: flex;
align-items: center;
line-height: 1.4;
font-size: 14px;
}
.zan-cell::after {
position: absolute;
left: 15px;
right: 0;
bottom: 0;
border-top: 1rpx solid #e5e5e5;
background: #e5e5e5;
content: ' ';
}
.zan-cell__icon {
margin-right: 5px;
}
.zan-cell__bd {
flex: 1;
}
.zan-cell__text {
line-height: 24px;
font-size: 14px;
}
.zan-cell__desc {
line-height: 1.2;
font-size: 12px;
color: #666;
}
.zan-cell__ft {
position: relative;
text-align: right;
color: #666;
}
.zan-cell__no-pading{
padding: 0;
}
.zan-cell__no-pading .zan-cell__bd_padding {
padding: 12px 0 12px 15px;
}
.zan-cell__no-pading .zan-cell__bd_padding .zan-form__input{
height: 26px;
}
.zan-cell__no-pading .zan-cell__ft_padding {
padding: 12px 15px 12px 0;
}
.zan-cell--last-child::after,
.zan-cell:last-child::after {
display: none;
}
.zan-cell--access .zan-cell__ft {
padding-right: 13px;
}
.zan-cell--access .zan-cell__ft::after {
position: absolute;
top: 50%;
right: 2px;
content: " ";
display: inline-block;
height: 6px;
width: 6px;
border-width: 2px 2px 0 0;
border-color: #c8c8c8;
border-style: solid;
transform: translateY(-50%) matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
}
.zan-cell--switch {
padding-top: 6px;
padding-bottom: 6px;
}
.zan-cell{position:relative;padding:12px 15px;display:flex;align-items:center;line-height:1.4;font-size:14px}.zan-cell::after{position:absolute;left:15px;right:0;bottom:0;border-top:1rpx solid #e5e5e5;background:#e5e5e5;content:' '}.zan-cell__icon{margin-right:5px}.zan-cell__bd{flex:1}.zan-cell__text{line-height:24px;font-size:14px}.zan-cell__desc{line-height:1.2;font-size:12px;color:#666}.zan-cell__ft{position:relative;text-align:right;color:#666}.zan-cell__no-pading{padding:0}.zan-cell__no-pading .zan-cell__bd_padding{padding:12px 0 12px 15px}.zan-cell__no-pading .zan-cell__bd_padding .zan-form__input{height:26px}.zan-cell__no-pading .zan-cell__ft_padding{padding:12px 15px 12px 0}.zan-cell--last-child::after,.zan-cell:last-child::after{display:none}.zan-cell--access .zan-cell__ft{padding-right:13px}.zan-cell--access .zan-cell__ft::after{position:absolute;top:50%;right:2px;content:" ";display:inline-block;height:6px;width:6px;border-width:2px 2px 0 0;border-color:#c8c8c8;border-style:solid;transform:translateY(-50%) matrix(.71,.71,-.71,.71,0,0)}.zan-cell--switch{padding-top:6px;padding-bottom:6px}

28
dist/color/index.wxss vendored
View File

@ -1,27 +1 @@
.zan-c-red {
color: #f44 !important;
}
.zan-c-gray {
color: #c9c9c9 !important;
}
.zan-c-gray-dark {
color: #999 !important;
}
.zan-c-gray-darker {
color: #666 !important;
}
.zan-c-black {
color: #333 !important;
}
.zan-c-blue {
color: #3283fa !important;
}
.zan-c-green {
color: #44BB00 !important;
}
.zan-c-red{color:#f44!important}.zan-c-gray{color:#c9c9c9!important}.zan-c-gray-dark{color:#999!important}.zan-c-gray-darker{color:#666!important}.zan-c-black{color:#333!important}.zan-c-blue{color:#3283fa!important}.zan-c-green{color:#4b0!important}

28
dist/dialog/index.wxss vendored
View File

@ -1,27 +1 @@
.zan-dialog__mask {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 10;
background: rgba(0, 0, 0, 0.7);
display: none;
}
.zan-dialog__container {
position: fixed;
left: 0;
bottom: 0;
width: 750rpx;
background: white;
transform: translateY(150%);
transition: all 0.4s ease;
z-index: 11;
}
.zan-dialog--show .zan-dialog__container {
transform: translateY(0);
}
.zan-dialog--show .zan-dialog__mask {
display: block;
}
.zan-dialog__mask{position:fixed;top:0;left:0;right:0;bottom:0;z-index:10;background:rgba(0,0,0,.7);display:none}.zan-dialog__container{position:fixed;left:0;bottom:0;width:750rpx;background:#fff;transform:translateY(150%);transition:all .4s ease;z-index:11}.zan-dialog--show .zan-dialog__container{transform:translateY(0)}.zan-dialog--show .zan-dialog__mask{display:block}

51
dist/field/index.wxss vendored
View File

@ -1,50 +1 @@
@import '../cell/index.wxss';
.zan-field {
padding: 7px 15px;
color: #333;
}
.zan-field--wrapped {
margin: 0 15px;
border: 1rpx solid #e5e5e5;
border-radius: 8rpx;
background-color: #fff;
}
.zan-field--wrapped::after {
border: 0rpx;
}
.zan-field--wrapped + .zan-field--wrapped {
margin-top: 10px;
}
.zan-field--error {
/* 圆角输入框时，将边框也置红 */
border-color: #f40;
color: #f40;
}
.zan-field__title {
color: #333;
min-width: 65px;
padding-right: 10px;
}
.zan-field__input {
flex: 1;
line-height: 1.6;
padding: 4px 0;
min-height: 22px;
height: auto;
font-size: 14px;
}
.zan-field__placeholder {
font-size: 14px;
}
.zan-field__input--right {
text-align: right;
}
.zan-cell{position:relative;padding:12px 15px;display:flex;align-items:center;line-height:1.4;font-size:14px}.zan-cell::after{position:absolute;left:15px;right:0;bottom:0;border-top:1rpx solid #e5e5e5;background:#e5e5e5;content:' '}.zan-cell__icon{margin-right:5px}.zan-cell__bd{flex:1}.zan-cell__text{line-height:24px;font-size:14px}.zan-cell__desc{line-height:1.2;font-size:12px;color:#666}.zan-cell__ft{position:relative;text-align:right;color:#666}.zan-cell__no-pading{padding:0}.zan-cell__no-pading .zan-cell__bd_padding{padding:12px 0 12px 15px}.zan-cell__no-pading .zan-cell__bd_padding .zan-form__input{height:26px}.zan-cell__no-pading .zan-cell__ft_padding{padding:12px 15px 12px 0}.zan-cell--last-child::after,.zan-cell:last-child::after{display:none}.zan-cell--access .zan-cell__ft{padding-right:13px}.zan-cell--access .zan-cell__ft::after{position:absolute;top:50%;right:2px;content:" ";display:inline-block;height:6px;width:6px;border-width:2px 2px 0 0;border-color:#c8c8c8;border-style:solid;transform:translateY(-50%) matrix(.71,.71,-.71,.71,0,0)}.zan-cell--switch{padding-top:6px;padding-bottom:6px}.zan-field{padding:7px 15px;color:#333}.zan-field--wrapped{margin:0 15px;border:1rpx solid #e5e5e5;border-radius:8rpx;background-color:#fff}.zan-field--wrapped::after{border:0rpx}.zan-field--wrapped+.zan-field--wrapped{margin-top:10px}.zan-field--error{border-color:#f40;color:#f40}.zan-field__title{color:#333;min-width:65px;padding-right:10px}.zan-field__input{flex:1;line-height:1.6;padding:4px 0;min-height:22px;height:auto;font-size:14px}.zan-field__placeholder{font-size:14px}.zan-field__input--right{text-align:right}

102
dist/helper/index.wxss vendored
View File

@ -1,101 +1 @@
.zan-pull-left {
float: left;
}
.zan-pull-right {
float: right;
}
.zan-center {
text-align: center;
}
.zan-right {
text-align: right;
}
.zan-text-deleted {
text-decoration: line-through;
}
.zan-font-8 {
font-size: 8px;
}
.zan-font-10 {
font-size: 10px;
}
.zan-font-12 {
font-size: 12px;
}
.zan-font-14 {
font-size: 14px;
}
.zan-font-16 {
font-size: 16px;
}
.zan-font-18 {
font-size: 18px;
}
.zan-font-20 {
font-size: 20px;
}
.zan-font-22 {
font-size: 22px;
}
.zan-font-24 {
font-size: 22px;
}
.zan-font-30 {
font-size: 30px;
}
.zan-font-bold {
font-weight: bold;
}
.zan-arrow {
position: absolute;
right: 15px;
top: 50%;
display: inline-block;
height: 6px;
width: 6px;
border-width: 2px 2px 0 0;
border-color: #c8c8c8;
border-style: solid;
transform: translateY(-50%) matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
}
.zan-ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
word-wrap: normal;
}
.zan-ellipsis--l2 {
max-height: 40px;
line-height: 20px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.zan-ellipsis--l3 {
max-height: 60px;
line-height: 20px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
.zan-clearfix {
zoom: 1;
}
.zan-clearfix::after {
content: '';
display: table;
clear: both;
}
.zan-pull-left{float:left}.zan-pull-right{float:right}.zan-center{text-align:center}.zan-right{text-align:right}.zan-text-deleted{text-decoration:line-through}.zan-font-8{font-size:8px}.zan-font-10{font-size:10px}.zan-font-12{font-size:12px}.zan-font-14{font-size:14px}.zan-font-16{font-size:16px}.zan-font-18{font-size:18px}.zan-font-20{font-size:20px}.zan-font-22{font-size:22px}.zan-font-24{font-size:22px}.zan-font-30{font-size:30px}.zan-font-bold{font-weight:700}.zan-arrow{position:absolute;right:15px;top:50%;display:inline-block;height:6px;width:6px;border-width:2px 2px 0 0;border-color:#c8c8c8;border-style:solid;transform:translateY(-50%) matrix(.71,.71,-.71,.71,0,0)}.zan-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal}.zan-ellipsis--l2{max-height:40px;line-height:20px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.zan-ellipsis--l3{max-height:60px;line-height:20px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}.zan-clearfix{zoom:1}.zan-clearfix::after{content:'';display:table;clear:both}

131
dist/icon/index.wxss vendored
View File

@ -1,130 +1 @@
/* DO NOT EDIT! Generated by fount */
@font-face {
font-family: 'zanui-weapp-icon';
src: url('https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-9e9804afef.eot');
src: url('https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-9e9804afef.eot?#iefix') format('embedded-opentype'),
url('https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-9e9804afef.woff2') format('woff2'),
url('https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-9e9804afef.woff') format('woff'),
url('https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-9e9804afef.ttf') format('truetype')
}
.zan-icon {
display: inline-block;
}
.zan-icon::before {
font-family: "zanui-weapp-icon" !important;
font-style: normal;
font-weight: normal;
speak: none;
display: inline-block;
text-decoration: inherit;
width: 1em;
text-align: center;
/* For safety - reset parent styles, that can break glyph codes*/
font-variant: normal;
text-transform: none;
/* fix buttons height, for twitter bootstrap */
line-height: 1em;
/* Animation center compensation - margins should be symmetric */
/* remove if not needed */
/* margin-left: .2em; */
/* you can be more comfortable with increased icons size */
/* font-size: 120%; */
/* Font smoothing. That was taken from TWBS */
-webkit-font-smoothing: antialiased;
/* Uncomment for 3D effect */
/* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
/* DO NOT EDIT! Generated by iconfount */
.zan-icon-qr-invalid:before { content: '\e800'; } /* '' */
.zan-icon-qr:before { content: '\e801'; } /* '' */
.zan-icon-exchange:before { content: '\e802'; } /* '' */
.zan-icon-close:before { content: '\e803'; } /* '' */
.zan-icon-location:before { content: '\e804'; } /* '' */
.zan-icon-upgrade:before { content: '\e805'; } /* '' */
.zan-icon-check:before { content: '\e806'; } /* '' */
.zan-icon-checked:before { content: '\e807'; } /* '' */
.zan-icon-like-o:before { content: '\e808'; } /* '' */
.zan-icon-like:before { content: '\e809'; } /* '' */
.zan-icon-chat:before { content: '\e80a'; } /* '' */
.zan-icon-shop:before { content: '\e80b'; } /* '' */
.zan-icon-photograph:before { content: '\e80c'; } /* '' */
.zan-icon-add:before { content: '\e80d'; } /* '' */
.zan-icon-add2:before { content: '\e80e'; } /* '' */
.zan-icon-photo:before { content: '\e80f'; } /* '' */
.zan-icon-logistics:before { content: '\e810'; } /* '' */
.zan-icon-edit:before { content: '\e811'; } /* '' */
.zan-icon-passed:before { content: '\e812'; } /* '' */
.zan-icon-shopping-cart:before { content: '\e813'; } /* '' */
.zan-icon-arrow:before { content: '\e814'; } /* '' */
.zan-icon-gift:before { content: '\e815'; } /* '' */
.zan-icon-search:before { content: '\e816'; } /* '' */
.zan-icon-clear:before { content: '\e817'; } /* '' */
.zan-icon-success:before { content: '\e818'; } /* '' */
.zan-icon-fail:before { content: '\e819'; } /* '' */
.zan-icon-contact:before { content: '\e81a'; } /* '' */
.zan-icon-wechat:before { content: '\e81b'; } /* '' */
.zan-icon-alipay:before { content: '\e81c'; } /* '' */
.zan-icon-password-view:before { content: '\e81d'; } /* '' */
.zan-icon-password-not-view:before { content: '\e81e'; } /* '' */
.zan-icon-wap-nav:before { content: '\e81f'; } /* '' */
.zan-icon-wap-home:before { content: '\e820'; } /* '' */
.zan-icon-ecard-pay:before { content: '\e821'; } /* '' */
.zan-icon-balance-pay:before { content: '\e822'; } /* '' */
.zan-icon-peer-pay:before { content: '\e823'; } /* '' */
.zan-icon-credit-pay:before { content: '\e824'; } /* '' */
.zan-icon-debit-pay:before { content: '\e825'; } /* '' */
.zan-icon-other-pay:before { content: '\e826'; } /* '' */
.zan-icon-cart:before { content: '\e827'; } /* '' */
.zan-icon-browsing-history:before { content: '\e828'; } /* '' */
.zan-icon-goods-collect:before { content: '\e829'; } /* '' */
.zan-icon-shop-collect:before { content: '\e82a'; } /* '' */
.zan-icon-receive-gift:before { content: '\e82b'; } /* '' */
.zan-icon-send-gift:before { content: '\e82c'; } /* '' */
.zan-icon-setting:before { content: '\e82d'; } /* '' */
.zan-icon-points:before { content: '\e82e'; } /* '' */
.zan-icon-coupon:before { content: '\e82f'; } /* '' */
.zan-icon-free-postage:before { content: '\e830'; } /* '' */
.zan-icon-discount:before { content: '\e831'; } /* '' */
.zan-icon-birthday-privilege:before { content: '\e832'; } /* '' */
.zan-icon-member-day-privilege:before { content: '\e833'; } /* '' */
.zan-icon-balance-details:before { content: '\e834'; } /* '' */
.zan-icon-cash-back-record:before { content: '\e835'; } /* '' */
.zan-icon-points-mall:before { content: '\e836'; } /* '' */
.zan-icon-exchange-record:before { content: '\e837'; } /* '' */
.zan-icon-pending-payment:before { content: '\e838'; } /* '' */
.zan-icon-pending-orders:before { content: '\e839'; } /* '' */
.zan-icon-pending-deliver:before { content: '\e83a'; } /* '' */
.zan-icon-pending-evaluate:before { content: '\e83b'; } /* '' */
.zan-icon-gift-card-pay:before { content: '\e83c'; } /* '' */
.zan-icon-cash-on-deliver:before { content: '\e83d'; } /* '' */
.zan-icon-underway:before { content: '\e83e'; } /* '' */
.zan-icon-point-gift:before { content: '\e83f'; } /* '' */
.zan-icon-after-sale:before { content: '\e840'; } /* '' */
.zan-icon-edit-data:before { content: '\e841'; } /* '' */
.zan-icon-question:before { content: '\e842'; } /* '' */
.zan-icon-delete:before { content: '\e843'; } /* '' */
.zan-icon-records:before { content: '\e844'; } /* '' */
.zan-icon-description:before { content: '\e845'; } /* '' */
.zan-icon-card:before { content: '\e846'; } /* '' */
.zan-icon-gift-card:before { content: '\e847'; } /* '' */
.zan-icon-coupon:before { content: '\e848'; } /* '' */
.zan-icon-clock:before { content: '\e849'; } /* '' */
.zan-icon-gold-coin:before { content: '\e84a'; } /* '' */
.zan-icon-completed:before { content: '\e84b'; } /* '' */
.zan-icon-value-card:before { content: '\e84c'; } /* '' */
.zan-icon-certificate:before { content: '\e84d'; } /* '' */
.zan-icon-tosend:before { content: '\e84e'; } /* '' */
.zan-icon-sign:before { content: '\e84f'; } /* '' */
.zan-icon-home:before { content: '\e850'; } /* '' */
.zan-icon-phone:before { content: '\e851'; } /* '' */
@font-face{font-family:zanui-weapp-icon;src:url(https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-9e9804afef.eot);src:url(https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-9e9804afef.eot?#iefix) format('embedded-opentype'),url(https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-9e9804afef.woff2) format('woff2'),url(https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-9e9804afef.woff) format('woff'),url(https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-9e9804afef.ttf) format('truetype')}.zan-icon{display:inline-block}.zan-icon::before{font-family:zanui-weapp-icon!important;font-style:normal;font-weight:400;speak:none;display:inline-block;text-decoration:inherit;width:1em;text-align:center;font-variant:normal;text-transform:none;line-height:1em;-webkit-font-smoothing:antialiased}.zan-icon-qr-invalid:before{content:'\e800'}.zan-icon-qr:before{content:'\e801'}.zan-icon-exchange:before{content:'\e802'}.zan-icon-close:before{content:'\e803'}.zan-icon-location:before{content:'\e804'}.zan-icon-upgrade:before{content:'\e805'}.zan-icon-check:before{content:'\e806'}.zan-icon-checked:before{content:'\e807'}.zan-icon-like-o:before{content:'\e808'}.zan-icon-like:before{content:'\e809'}.zan-icon-chat:before{content:'\e80a'}.zan-icon-shop:before{content:'\e80b'}.zan-icon-photograph:before{content:'\e80c'}.zan-icon-add:before{content:'\e80d'}.zan-icon-add2:before{content:'\e80e'}.zan-icon-photo:before{content:'\e80f'}.zan-icon-logistics:before{content:'\e810'}.zan-icon-edit:before{content:'\e811'}.zan-icon-passed:before{content:'\e812'}.zan-icon-shopping-cart:before{content:'\e813'}.zan-icon-arrow:before{content:'\e814'}.zan-icon-gift:before{content:'\e815'}.zan-icon-search:before{content:'\e816'}.zan-icon-clear:before{content:'\e817'}.zan-icon-success:before{content:'\e818'}.zan-icon-fail:before{content:'\e819'}.zan-icon-contact:before{content:'\e81a'}.zan-icon-wechat:before{content:'\e81b'}.zan-icon-alipay:before{content:'\e81c'}.zan-icon-password-view:before{content:'\e81d'}.zan-icon-password-not-view:before{content:'\e81e'}.zan-icon-wap-nav:before{content:'\e81f'}.zan-icon-wap-home:before{content:'\e820'}.zan-icon-ecard-pay:before{content:'\e821'}.zan-icon-balance-pay:before{content:'\e822'}.zan-icon-peer-pay:before{content:'\e823'}.zan-icon-credit-pay:before{content:'\e824'}.zan-icon-debit-pay:before{content:'\e825'}.zan-icon-other-pay:before{content:'\e826'}.zan-icon-cart:before{content:'\e827'}.zan-icon-browsing-history:before{content:'\e828'}.zan-icon-goods-collect:before{content:'\e829'}.zan-icon-shop-collect:before{content:'\e82a'}.zan-icon-receive-gift:before{content:'\e82b'}.zan-icon-send-gift:before{content:'\e82c'}.zan-icon-setting:before{content:'\e82d'}.zan-icon-points:before{content:'\e82e'}.zan-icon-coupon:before{content:'\e82f'}.zan-icon-free-postage:before{content:'\e830'}.zan-icon-discount:before{content:'\e831'}.zan-icon-birthday-privilege:before{content:'\e832'}.zan-icon-member-day-privilege:before{content:'\e833'}.zan-icon-balance-details:before{content:'\e834'}.zan-icon-cash-back-record:before{content:'\e835'}.zan-icon-points-mall:before{content:'\e836'}.zan-icon-exchange-record:before{content:'\e837'}.zan-icon-pending-payment:before{content:'\e838'}.zan-icon-pending-orders:before{content:'\e839'}.zan-icon-pending-deliver:before{content:'\e83a'}.zan-icon-pending-evaluate:before{content:'\e83b'}.zan-icon-gift-card-pay:before{content:'\e83c'}.zan-icon-cash-on-deliver:before{content:'\e83d'}.zan-icon-underway:before{content:'\e83e'}.zan-icon-point-gift:before{content:'\e83f'}.zan-icon-after-sale:before{content:'\e840'}.zan-icon-edit-data:before{content:'\e841'}.zan-icon-question:before{content:'\e842'}.zan-icon-delete:before{content:'\e843'}.zan-icon-records:before{content:'\e844'}.zan-icon-description:before{content:'\e845'}.zan-icon-card:before{content:'\e846'}.zan-icon-gift-card:before{content:'\e847'}.zan-icon-coupon:before{content:'\e848'}.zan-icon-clock:before{content:'\e849'}.zan-icon-gold-coin:before{content:'\e84a'}.zan-icon-completed:before{content:'\e84b'}.zan-icon-value-card:before{content:'\e84c'}.zan-icon-certificate:before{content:'\e84d'}.zan-icon-tosend:before{content:'\e84e'}.zan-icon-sign:before{content:'\e84f'}.zan-icon-home:before{content:'\e850'}.zan-icon-phone:before{content:'\e851'}

23
dist/index.wxss vendored
View File

File diff suppressed because one or more lines are too long

35
dist/label/index.wxss vendored
View File

@ -1,34 +1 @@
.zan-label {
display: inline-block;
font-size: 12px;
height: 28px;
line-height: 28px;
color: #333;
border: 1rpx solid #999;
padding: 0px 10px;
border-radius: 2px;
margin-right: 10px;
box-sizing: border-box;
vertical-align: middle;
text-align: center;
}
.zan-label--primary {
color: #fff;
background: #f44;
border: 1rpx solid #f44;
}
.zan-label--disabled {
color: #cacaca;
background: #eee;
border: 1rpx solid #e5e5e5;
}
.zan-label--small {
font-size: 11px;
height: 16px;
line-height: 16px;
padding: 0px 3px;
}
.zan-label--plain.zan-label--primary {
color: #f44;
background: #fff;
}
.zan-label{display:inline-block;font-size:12px;height:28px;line-height:28px;color:#333;border:1rpx solid #999;padding:0 10px;border-radius:2px;margin-right:10px;box-sizing:border-box;vertical-align:middle;text-align:center}.zan-label--primary{color:#fff;background:#f44;border:1rpx solid #f44}.zan-label--disabled{color:#cacaca;background:#eee;border:1rpx solid #e5e5e5}.zan-label--small{font-size:11px;height:16px;line-height:16px;padding:0 3px}.zan-label--plain.zan-label--primary{color:#f44;background:#fff}

71
dist/loadmore/index.wxss vendored
View File

@ -1,70 +1 @@
.zan-loadmore {
position: relative;
width: 65%;
margin: 21px auto;
line-height: 20px;
font-size: 14px;
text-align: center;
vertical-align: middle;
}
.zan-loading {
width:20px;
height:20px;
display: inline-block;
vertical-align: middle;
animation: weuiLoading 1s steps(12, end) infinite;
background: transparent url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iciIgd2lkdGg9JzEyMHB4JyBoZWlnaHQ9JzEyMHB4JyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj4KICAgIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAiIGhlaWdodD0iMTAwIiBmaWxsPSJub25lIiBjbGFzcz0iYmsiPjwvcmVjdD4KICAgIDxyZWN0IHg9JzQ2LjUnIHk9JzQwJyB3aWR0aD0nNycgaGVpZ2h0PScyMCcgcng9JzUnIHJ5PSc1JyBmaWxsPScjRTlFOUU5JwogICAgICAgICAgdHJhbnNmb3JtPSdyb3RhdGUoMCA1MCA1MCkgdHJhbnNsYXRlKDAgLTMwKSc+CiAgICA8L3JlY3Q+CiAgICA8cmVjdCB4PSc0Ni41JyB5PSc0MCcgd2lkdGg9JzcnIGhlaWdodD0nMjAnIHJ4PSc1JyByeT0nNScgZmlsbD0nIzk4OTY5NycKICAgICAgICAgIHRyYW5zZm9ybT0ncm90YXRlKDMwIDUwIDUwKSB0cmFuc2xhdGUoMCAtMzApJz4KICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0naW5kZWZpbml0ZScvPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyM5Qjk5OUEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSg2MCA1MCA1MCkgdHJhbnNsYXRlKDAgLTMwKSc+CiAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9J2luZGVmaW5pdGUnLz4KICAgIDwvcmVjdD4KICAgIDxyZWN0IHg9JzQ2LjUnIHk9JzQwJyB3aWR0aD0nNycgaGVpZ2h0PScyMCcgcng9JzUnIHJ5PSc1JyBmaWxsPScjQTNBMUEyJwogICAgICAgICAgdHJhbnNmb3JtPSdyb3RhdGUoOTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNBQkE5QUEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxMjAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNCMkIyQjInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxNTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNCQUI4QjknCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxODAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNDMkMwQzEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyMTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNDQkNCQ0InCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyNDAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNEMkQyRDInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyNzAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNEQURBREEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgzMDAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNFMkUyRTInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgzMzAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0Pgo8L3N2Zz4=) no-repeat;
-webkit-background-size: 100%;
background-size: 100%;
}
.zan-loadmore .zan-loading {
margin-right: 4px;
}
.zan-loadmore__tips {
display: inline-block;
vertical-align: middle;
height: 20px;
line-height: 20px;
}
.zan-loadmore--nodata,
.zan-loadmore--nomore {
border-top: 1rpx solid #e5e5e5;
color: #999;
}
.zan-loadmore--nodata {
margin-top: 120px;
}
.zan-loadmore--nodata .zan-loadmore__tips {
position: relative;
top: -11px;
background: #f9f9f9;
padding: 0 6px;
}
.zan-loadmore--nomore .zan-loadmore__tips {
position: relative;
top: -11px;
background: #f9f9f9;
padding: 0 6px;
}
.zan-loadmore__dot {
position: absolute;
left: 50%;
top: 10px;
margin-left: -2px;
margin-top: -2px;
content: " ";
width: 4px;
height: 4px;
border-radius: 50%;
background-color: #E5E5E5;
display: inline-block;
vertical-align: middle;
}
.zan-loadmore{position:relative;width:65%;margin:21px auto;line-height:20px;font-size:14px;text-align:center;vertical-align:middle}.zan-loading{width:20px;height:20px;display:inline-block;vertical-align:middle;animation:weuiLoading 1s steps(12,end) infinite;background:transparent url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iciIgd2lkdGg9JzEyMHB4JyBoZWlnaHQ9JzEyMHB4JyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj4KICAgIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAiIGhlaWdodD0iMTAwIiBmaWxsPSJub25lIiBjbGFzcz0iYmsiPjwvcmVjdD4KICAgIDxyZWN0IHg9JzQ2LjUnIHk9JzQwJyB3aWR0aD0nNycgaGVpZ2h0PScyMCcgcng9JzUnIHJ5PSc1JyBmaWxsPScjRTlFOUU5JwogICAgICAgICAgdHJhbnNmb3JtPSdyb3RhdGUoMCA1MCA1MCkgdHJhbnNsYXRlKDAgLTMwKSc+CiAgICA8L3JlY3Q+CiAgICA8cmVjdCB4PSc0Ni41JyB5PSc0MCcgd2lkdGg9JzcnIGhlaWdodD0nMjAnIHJ4PSc1JyByeT0nNScgZmlsbD0nIzk4OTY5NycKICAgICAgICAgIHRyYW5zZm9ybT0ncm90YXRlKDMwIDUwIDUwKSB0cmFuc2xhdGUoMCAtMzApJz4KICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0naW5kZWZpbml0ZScvPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyM5Qjk5OUEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSg2MCA1MCA1MCkgdHJhbnNsYXRlKDAgLTMwKSc+CiAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9J2luZGVmaW5pdGUnLz4KICAgIDwvcmVjdD4KICAgIDxyZWN0IHg9JzQ2LjUnIHk9JzQwJyB3aWR0aD0nNycgaGVpZ2h0PScyMCcgcng9JzUnIHJ5PSc1JyBmaWxsPScjQTNBMUEyJwogICAgICAgICAgdHJhbnNmb3JtPSdyb3RhdGUoOTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNBQkE5QUEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxMjAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNCMkIyQjInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxNTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNCQUI4QjknCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxODAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNDMkMwQzEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyMTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNDQkNCQ0InCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyNDAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNEMkQyRDInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyNzAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNEQURBREEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgzMDAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNFMkUyRTInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgzMzAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0Pgo8L3N2Zz4=) no-repeat;-webkit-background-size:100%;background-size:100%}.zan-loadmore .zan-loading{margin-right:4px}.zan-loadmore__tips{display:inline-block;vertical-align:middle;height:20px;line-height:20px}.zan-loadmore--nodata,.zan-loadmore--nomore{border-top:1rpx solid #e5e5e5;color:#999}.zan-loadmore--nodata{margin-top:120px}.zan-loadmore--nodata .zan-loadmore__tips{position:relative;top:-11px;background:#f9f9f9;padding:0 6px}.zan-loadmore--nomore .zan-loadmore__tips{position:relative;top:-11px;background:#f9f9f9;padding:0 6px}.zan-loadmore__dot{position:absolute;left:50%;top:10px;margin-left:-2px;margin-top:-2px;content:" ";width:4px;height:4px;border-radius:50%;background-color:#e5e5e5;display:inline-block;vertical-align:middle}

8
dist/noticebar/index.wxss vendored
View File

@ -1,7 +1 @@
.zan-noticebar {
color: #f60;
padding: 9px 10px;
font-size: 12px;
line-height: 1.5;
background-color: #fff7cc;
}
.zan-noticebar{color:#f60;padding:9px 10px;font-size:12px;line-height:1.5;background-color:#fff7cc}

20
dist/panel/index.wxss vendored
View File

@ -1,19 +1 @@
.zan-panel {
background: #fff;
border-top: 1rpx solid #e5e5e5;
border-bottom: 1rpx solid #e5e5e5;
margin-top: 10px;
overflow: hidden;
}
.zan-panel-title {
font-size: 14px;
line-height: 1;
color: #999;
padding: 20px 15px 0 15px;
}
.zan-panel--without-margin-top {
margin-top: 0;
}
.zan-panel{background:#fff;border-top:1rpx solid #e5e5e5;border-bottom:1rpx solid #e5e5e5;margin-top:10px;overflow:hidden}.zan-panel-title{font-size:14px;line-height:1;color:#999;padding:20px 15px 0 15px}.zan-panel--without-margin-top{margin-top:0}

32
dist/popup/index.wxss vendored
View File

@ -1,31 +1 @@
.zan-popup {
position: fixed;
background-color: #fff;
width: 100%;
height: 100%;
top: 50%;
left: 50%;
transform: translate3d(-50%, -50%, 0);
transition: .2s ease-out;
}
.zan-popup--top {
width: 100%;
top: 0;
right: auto;
bottom: auto;
left: 50%;
transform: translate3d(-50%, 0, 0);
}
.zan-popup--right {
transform: translate3d(50%, -50%, 0);
}
.zan-popup--left {
transform: translate3d(-150%, -50%, 0);
}
.zan-popup--show {
transform: translate3d(-50%, -50%, 0);
}
.zan-popup{position:fixed;background-color:#fff;width:100%;height:100%;top:50%;left:50%;transform:translate3d(-50%,-50%,0);transition:.2s ease-out}.zan-popup--top{width:100%;top:0;right:auto;bottom:auto;left:50%;transform:translate3d(-50%,0,0)}.zan-popup--right{transform:translate3d(50%,-50%,0)}.zan-popup--left{transform:translate3d(-150%,-50%,0)}.zan-popup--show{transform:translate3d(-50%,-50%,0)}

47
dist/quantity/index.wxss vendored
View File

@ -1,46 +1 @@
.zan-quantity {
color: #666;
}
.zan-quantity view {
display: inline-block;
line-height: 20px;
padding: 5px 0;
text-align: center;
min-width: 40px;
box-sizing: border-box;
vertical-align: middle;
font-size: 12px;
border: 1rpx solid #999;
}
.zan-quantity .zan-quantity__minus {
border-right: none;
border-radius: 2px 0 0 2px;
}
.zan-quantity .zan-quantity__text {
border: 1rpx solid #999;
display: inline-block;
text-align: center;
vertical-align: middle;
height: 30px;
width: 40px;
font-size: 12px;
line-height: 30px;
}
.zan-quantity .zan-quantity__plus {
border-left: none;
border-radius: 0 2px 2px 0;
}
.zan-quantity .zan-quantity--disabled {
background: #f8f8f8;
color: #bbb;
border-color: #e8e8e8;
}
.zan-quantity--small view {
min-width: 36px;
line-height: 18px;
}
.zan-quantity--small .zan-quantity__text {
width: 36px;
line-height: 28px;
height: 28px;
}
.zan-quantity{color:#666}.zan-quantity view{display:inline-block;line-height:20px;padding:5px 0;text-align:center;min-width:40px;box-sizing:border-box;vertical-align:middle;font-size:12px;border:1rpx solid #999}.zan-quantity .zan-quantity__minus{border-right:none;border-radius:2px 0 0 2px}.zan-quantity .zan-quantity__text{border:1rpx solid #999;display:inline-block;text-align:center;vertical-align:middle;height:30px;width:40px;font-size:12px;line-height:30px}.zan-quantity .zan-quantity__plus{border-left:none;border-radius:0 2px 2px 0}.zan-quantity .zan-quantity--disabled{background:#f8f8f8;color:#bbb;border-color:#e8e8e8}.zan-quantity--small view{min-width:36px;line-height:18px}.zan-quantity--small .zan-quantity__text{width:36px;line-height:28px;height:28px}

4
dist/select/index.wxss vendored
View File

@ -1,3 +1 @@
.zan-select__list .zan-select__radio{
display: none;
}
.zan-select__list .zan-select__radio{display:none}

7
dist/steps/index.wxss vendored
View File

@ -1,6 +1 @@
@import "wxss/step.wxss";
@import "wxss/vstep.wxss";
.zan-steps {
position: relative;
}
.zan-steps--steps.zan-steps--5 .zan-steps__step{width:25%}.zan-steps--steps.zan-steps--4 .zan-steps__step{width:33%}.zan-steps--steps.zan-steps--3 .zan-steps__step{width:50%}.zan-steps--steps .zan-steps__step{position:relative;float:left;padding-bottom:25px;color:#b1b1b1}.zan-steps--steps .zan-steps__title{transform:translateX(-50%);font-size:10px;text-align:center}.zan-steps--steps .zan-steps__icons{position:absolute;top:30px;left:-10px;padding:0 8px;background-color:#fff;z-index:10}.zan-steps--steps .zan-steps__circle{display:block;position:relative;width:5px;height:5px;background-color:#e5e5e5;border-radius:50%}.zan-steps--steps .zan-steps__line{position:absolute;left:0;top:32px;width:100%;height:1px;background-color:#e5e5e5}.zan-steps--steps .zan-steps__step--done{color:#333}.zan-steps--steps .zan-steps__step--done .zan-steps__line{background-color:#06bf04}.zan-steps--steps .zan-steps__step--done .zan-steps__circle{width:5px;height:5px;background-color:#09bb07}.zan-steps--steps .zan-steps__step--cur .zan-steps__icons{top:25px;left:-14px}.zan-steps--steps .zan-steps__step--cur .zan-steps__circle{width:13px;height:13px;background-image:url(https://b.yzcdn.cn/v2/image/wap/success_small@2x.png);background-size:13px 13px}.zan-steps--steps .zan-steps__step--cur .zan-steps__line{background-color:#e5e5e5}.zan-steps--steps .zan-steps__step--first-child .zan-steps__title{margin-left:0;transform:none;text-align:left}.zan-steps--steps .zan-steps__step--first-child .zan-steps__icons{left:-7px}.zan-steps--steps .zan-steps__step--last-child{position:absolute;right:0;top:0;text-align:right}.zan-steps--steps .zan-steps__step--last-child .zan-steps__title{transform:none;text-align:right}.zan-steps--steps .zan-steps__step--last-child .zan-steps__icons{left:auto;right:-6px}.zan-steps--steps .zan-steps__step--last-child .zan-steps__line{display:none}.zan-steps--steps .zan-steps__step--db-title{min-height:29px}.zan-steps--steps .zan-steps__step--db-title .zan-steps__line{top:45px}.zan-steps--steps .zan-steps__step--db-title .zan-steps__icons{top:43px}.zan-steps--steps .zan-steps__step--db-title.zan-steps__step--cur .zan-steps__icons{top:39px}.zan-steps--vsteps{color:#999;font-size:14px}.zan-steps--vsteps .zan-steps__step{position:relative;padding:15px 0}.zan-steps--vsteps .zan-steps__step--done{color:#4b0}.zan-steps--vsteps .zan-steps__line{position:absolute;top:0;bottom:0;left:7px;width:1px;background-color:#e5e5e5}.zan-steps--vsteps .zan-steps__title{display:inline-block;line-height:20px;padding-left:27px}.zan-steps--vsteps .zan-steps__title--desc{padding-left:3px}.zan-steps--vsteps .zan-steps__icons{position:absolute;left:7px;top:50%;transform:translate(-50%,-50%);z-index:2;padding:3px 0;background-color:#fff}.zan-steps--vsteps .zan-steps__circle{width:5px;height:5px;background-color:#cacaca;border-radius:10px}.zan-steps--vsteps .zan-steps__step--done .zan-steps__circle{width:5px;height:5px;background-color:#09bb07}.zan-steps--vsteps .zan-steps__step--cur .zan-steps__circle{width:13px;height:13px;background:transparent url(https://b.yzcdn.cn/v2/image/wap/success_small@2x.png);background-size:13px 13px;border-radius:0}.zan-steps--vsteps .zan-steps__icon--active{width:13px;height:13px}.zan-steps--vsteps .zan-steps__step--first-child .zan-steps__title::before{content:'';position:absolute;top:0;bottom:50%;left:7px;width:1px;background-color:#fff;z-index:1}.zan-steps--vsteps .zan-steps__step--last-child .zan-steps__title::after{content:'';position:absolute;top:50%;bottom:0;left:7px;width:1px;background-color:#fff;z-index:1}.zan-steps{position:relative}

134
dist/steps/wxss/step.wxss vendored
View File

@ -1,133 +1 @@
.zan-steps--steps.zan-steps--5 .zan-steps__step {
width: 25%;
}
.zan-steps--steps.zan-steps--4 .zan-steps__step {
width: 33%;
}
.zan-steps--steps.zan-steps--3 .zan-steps__step {
width: 50%;
}
.zan-steps--steps .zan-steps__step {
position: relative;
float: left;
padding-bottom: 25px;
color: #b1b1b1;
}
.zan-steps--steps .zan-steps__title {
transform: translateX(-50%);
font-size: 10px;
text-align: center;
}
.zan-steps--steps .zan-steps__icons {
position: absolute;
top: 30px;
left: -10px;
padding: 0 8px;
background-color: #fff;
z-index: 10;
}
.zan-steps--steps .zan-steps__circle {
display: block;
position: relative;
width: 5px;
height: 5px;
background-color: #e5e5e5;
border-radius: 50%;
}
.zan-steps--steps .zan-steps__line {
position: absolute;
left: 0px;
top: 32px;
width: 100%;
height: 1px;
background-color: #e5e5e5;
}
/* 已完成的steps */
.zan-steps--steps .zan-steps__step--done {
color: #333;
}
.zan-steps--steps .zan-steps__step--done .zan-steps__line {
background-color: #06bf04;
}
.zan-steps--steps .zan-steps__step--done .zan-steps__circle {
width: 5px;
height: 5px;
background-color: #09bb07;
}
/* 正在进行中的steps */
.zan-steps--steps .zan-steps__step--cur .zan-steps__icons {
top: 25px;
left: -14px;
}
.zan-steps--steps .zan-steps__step--cur .zan-steps__circle {
width: 13px;
height: 13px;
background-image: url("https://b.yzcdn.cn/v2/image/wap/success_small@2x.png");
background-size: 13px 13px;
}
.zan-steps--steps .zan-steps__step--cur .zan-steps__line {
background-color: #e5e5e5;
}
/* 各种不同位置的 */
.zan-steps--steps .zan-steps__step--first-child .zan-steps__title {
margin-left: 0;
transform: none;
text-align: left;
}
.zan-steps--steps .zan-steps__step--first-child .zan-steps__icons {
left: -7px;
}
.zan-steps--steps .zan-steps__step--last-child {
position: absolute;
right: 0;
top: 0;
text-align: right;
}
.zan-steps--steps .zan-steps__step--last-child .zan-steps__title {
transform: none;
text-align: right;
}
.zan-steps--steps .zan-steps__step--last-child .zan-steps__icons {
left: auto;
right: -6px;
}
.zan-steps--steps .zan-steps__step--last-child .zan-steps__line {
display: none;
}
/* 有描述的step */
.zan-steps--steps .zan-steps__step--db-title {
min-height: 29px;
}
.zan-steps--steps .zan-steps__step--db-title .zan-steps__line {
top: 45px;
}
.zan-steps--steps .zan-steps__step--db-title .zan-steps__icons {
top: 43px;
}
.zan-steps--steps .zan-steps__step--db-title.zan-steps__step--cur .zan-steps__icons {
top: 39px;
}
.zan-steps--steps.zan-steps--5 .zan-steps__step{width:25%}.zan-steps--steps.zan-steps--4 .zan-steps__step{width:33%}.zan-steps--steps.zan-steps--3 .zan-steps__step{width:50%}.zan-steps--steps .zan-steps__step{position:relative;float:left;padding-bottom:25px;color:#b1b1b1}.zan-steps--steps .zan-steps__title{transform:translateX(-50%);font-size:10px;text-align:center}.zan-steps--steps .zan-steps__icons{position:absolute;top:30px;left:-10px;padding:0 8px;background-color:#fff;z-index:10}.zan-steps--steps .zan-steps__circle{display:block;position:relative;width:5px;height:5px;background-color:#e5e5e5;border-radius:50%}.zan-steps--steps .zan-steps__line{position:absolute;left:0;top:32px;width:100%;height:1px;background-color:#e5e5e5}.zan-steps--steps .zan-steps__step--done{color:#333}.zan-steps--steps .zan-steps__step--done .zan-steps__line{background-color:#06bf04}.zan-steps--steps .zan-steps__step--done .zan-steps__circle{width:5px;height:5px;background-color:#09bb07}.zan-steps--steps .zan-steps__step--cur .zan-steps__icons{top:25px;left:-14px}.zan-steps--steps .zan-steps__step--cur .zan-steps__circle{width:13px;height:13px;background-image:url(https://b.yzcdn.cn/v2/image/wap/success_small@2x.png);background-size:13px 13px}.zan-steps--steps .zan-steps__step--cur .zan-steps__line{background-color:#e5e5e5}.zan-steps--steps .zan-steps__step--first-child .zan-steps__title{margin-left:0;transform:none;text-align:left}.zan-steps--steps .zan-steps__step--first-child .zan-steps__icons{left:-7px}.zan-steps--steps .zan-steps__step--last-child{position:absolute;right:0;top:0;text-align:right}.zan-steps--steps .zan-steps__step--last-child .zan-steps__title{transform:none;text-align:right}.zan-steps--steps .zan-steps__step--last-child .zan-steps__icons{left:auto;right:-6px}.zan-steps--steps .zan-steps__step--last-child .zan-steps__line{display:none}.zan-steps--steps .zan-steps__step--db-title{min-height:29px}.zan-steps--steps .zan-steps__step--db-title .zan-steps__line{top:45px}.zan-steps--steps .zan-steps__step--db-title .zan-steps__icons{top:43px}.zan-steps--steps .zan-steps__step--db-title.zan-steps__step--cur .zan-steps__icons{top:39px}

91
dist/steps/wxss/vstep.wxss vendored
View File

@ -1,90 +1 @@
.zan-steps--vsteps {
color: #999;
font-size: 14px;
}
.zan-steps--vsteps .zan-steps__step {
position: relative;
padding: 15px 0;
}
.zan-steps--vsteps .zan-steps__step--done {
color: #44BB00;
}
.zan-steps--vsteps .zan-steps__line {
position: absolute;
top: 0;
bottom: 0;
left: 7px;
width: 1px;
background-color: #e5e5e5;
}
.zan-steps--vsteps .zan-steps__title {
display: inline-block;
line-height: 20px;
padding-left: 27px;
}
.zan-steps--vsteps .zan-steps__title--desc {
padding-left: 3px;
}
.zan-steps--vsteps .zan-steps__icons {
position: absolute;
left: 7px;
top: 50%;
transform: translate(-50%, -50%);
z-index: 2;
padding: 3px 0;
background-color: #fff;
}
.zan-steps--vsteps .zan-steps__circle {
width: 5px;
height: 5px;
background-color: #cacaca;
border-radius: 10px;
}
.zan-steps--vsteps .zan-steps__step--done .zan-steps__circle {
width: 5px;
height: 5px;
background-color: #09bb07;
}
.zan-steps--vsteps .zan-steps__step--cur .zan-steps__circle {
width: 13px;
height: 13px;
background: transparent url("https://b.yzcdn.cn/v2/image/wap/success_small@2x.png");
background-size: 13px 13px;
border-radius:0;
}
.zan-steps--vsteps .zan-steps__icon--active {
width: 13px;
height: 13px;
}
.zan-steps--vsteps .zan-steps__step--first-child .zan-steps__title::before {
content: '';
position: absolute;
top: 0;
bottom: 50%;
left: 7px;
width: 1px;
background-color: #fff;
z-index: 1;
}
.zan-steps--vsteps .zan-steps__step--last-child .zan-steps__title::after {
content: '';
position: absolute;
top: 50%;
bottom: 0%;
left: 7px;
width: 1px;
background-color: #fff;
z-index: 1;
}
.zan-steps--vsteps{color:#999;font-size:14px}.zan-steps--vsteps .zan-steps__step{position:relative;padding:15px 0}.zan-steps--vsteps .zan-steps__step--done{color:#4b0}.zan-steps--vsteps .zan-steps__line{position:absolute;top:0;bottom:0;left:7px;width:1px;background-color:#e5e5e5}.zan-steps--vsteps .zan-steps__title{display:inline-block;line-height:20px;padding-left:27px}.zan-steps--vsteps .zan-steps__title--desc{padding-left:3px}.zan-steps--vsteps .zan-steps__icons{position:absolute;left:7px;top:50%;transform:translate(-50%,-50%);z-index:2;padding:3px 0;background-color:#fff}.zan-steps--vsteps .zan-steps__circle{width:5px;height:5px;background-color:#cacaca;border-radius:10px}.zan-steps--vsteps .zan-steps__step--done .zan-steps__circle{width:5px;height:5px;background-color:#09bb07}.zan-steps--vsteps .zan-steps__step--cur .zan-steps__circle{width:13px;height:13px;background:transparent url(https://b.yzcdn.cn/v2/image/wap/success_small@2x.png);background-size:13px 13px;border-radius:0}.zan-steps--vsteps .zan-steps__icon--active{width:13px;height:13px}.zan-steps--vsteps .zan-steps__step--first-child .zan-steps__title::before{content:'';position:absolute;top:0;bottom:50%;left:7px;width:1px;background-color:#fff;z-index:1}.zan-steps--vsteps .zan-steps__step--last-child .zan-steps__title::after{content:'';position:absolute;top:50%;bottom:0;left:7px;width:1px;background-color:#fff;z-index:1}

70
dist/switch/index.wxss vendored
View File

@ -1,69 +1 @@
.zan-switch {
position: relative;
display: inline-block;
width: 52px;
height: 32px;
vertical-align: middle;
box-sizing: border-box;
border-radius: 16px;
background: #44DB5E;
border: 1px solid #44DB5E;
}
.zan-switch__circle {
position: absolute;
top: 0;
left: 0;
width: 30px;
height: 30px;
display: inline-block;
background: #fff;
border-radius: 15px;
box-sizing: border-box;
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05);
transition: transform 0.35s cubic-bezier(0.45, 1, 0.4, 1);
z-index: 2;
}
.zan-switch__bg {
position: absolute;
top: -1px;
left: -1px;
width: 52px;
height: 32px;
background: #fff;
border-radius: 26px;
display: inline-block;
border: 1px solid #e5e5e5;
box-sizing: border-box;
transition: transform 0.35s cubic-bezier(0.45, 1, 0.4, 1);
transform: scale(0);
transform-origin: 36px 16px;
}
.zan-switch--on .zan-switch__circle {
transform: translateX(20px);
}
.zan-switch--off .zan-switch__bg {
transform: scale(1);
}
.zan-swtich--disabled {
opacity: 0.4;
}
.zan-switch__loading {
position: absolute;
left: 7px;
top: 7px;
width: 16px;
height: 16px;
background: url(https://img.yzcdn.cn/public_files/2017/02/24/9acec77d91106cd15b8107c4633d9155.png) no-repeat;
background-size: 16px 16px;
animation: zan-switch-loading 0.8s infinite linear;
}
@keyframes zan-switch-loading {
from {
transform: rotate(0);
}
to {
transform: rotate(360deg);
}
}
.zan-switch{position:relative;display:inline-block;width:52px;height:32px;vertical-align:middle;box-sizing:border-box;border-radius:16px;background:#44db5e;border:1px solid #44db5e}.zan-switch__circle{position:absolute;top:0;left:0;width:30px;height:30px;display:inline-block;background:#fff;border-radius:15px;box-sizing:border-box;box-shadow:0 0 0 1px rgba(0,0,0,.1),0 3px 1px 0 rgba(0,0,0,.05),0 2px 2px 0 rgba(0,0,0,.1),0 3px 3px 0 rgba(0,0,0,.05);transition:transform .35s cubic-bezier(.45,1,.4,1);z-index:2}.zan-switch__bg{position:absolute;top:-1px;left:-1px;width:52px;height:32px;background:#fff;border-radius:26px;display:inline-block;border:1px solid #e5e5e5;box-sizing:border-box;transition:transform .35s cubic-bezier(.45,1,.4,1);transform:scale(0);transform-origin:36px 16px}.zan-switch--on .zan-switch__circle{transform:translateX(20px)}.zan-switch--off .zan-switch__bg{transform:scale(1)}.zan-swtich--disabled{opacity:.4}.zan-switch__loading{position:absolute;left:7px;top:7px;width:16px;height:16px;background:url(https://img.yzcdn.cn/public_files/2017/02/24/9acec77d91106cd15b8107c4633d9155.png) no-repeat;background-size:16px 16px;animation:zan-switch-loading .8s infinite linear}@keyframes zan-switch-loading{from{transform:rotate(0)}to{transform:rotate(360deg)}}

49
dist/tab/index.wxss vendored
View File

@ -1,48 +1 @@
.zan-tab {
height: 45px;
}
.zan-tab__bd {
width: 750rpx;
display: flex;
flex-direction: row;
border-bottom: 1rpx solid #e5e5e5;
background: #fff;
}
.zan-tab__bd--fixed {
position: fixed;
top: 0;
z-index: 2;
}
.zan-tab__item {
flex: 1;
display: inline-block;
text-align: center;
box-sizing: border-box;
}
.zan-tab__title {
font-size: 14px;
display: inline-block;
color: #666;
height: 44px;
line-height: 44px;
box-sizing: border-box;
margin: 0 10px;
word-break: keep-all;
}
.zan-tab__item--selected .zan-tab__title {
color: #f44;
border-bottom: 2px solid #f44;
}
.zan-tab__bd--scroll {
display: block;
white-space: nowrap;
}
.zan-tab__bd--scroll .zan-tab__item {
min-width: 80px;
}
.zan-tab__bd--scroll .zan-tab__text {
margin: 0 20px;
}
.zan-tab{height:45px}.zan-tab__bd{width:750rpx;display:flex;flex-direction:row;border-bottom:1rpx solid #e5e5e5;background:#fff}.zan-tab__bd--fixed{position:fixed;top:0;z-index:2}.zan-tab__item{flex:1;display:inline-block;text-align:center;box-sizing:border-box}.zan-tab__title{font-size:14px;display:inline-block;color:#666;height:44px;line-height:44px;box-sizing:border-box;margin:0 10px;word-break:keep-all}.zan-tab__item--selected .zan-tab__title{color:#f44;border-bottom:2px solid #f44}.zan-tab__bd--scroll{display:block;white-space:nowrap}.zan-tab__bd--scroll .zan-tab__item{min-width:80px}.zan-tab__bd--scroll .zan-tab__text{margin:0 20px}

18
dist/toast/index.wxss vendored
View File

@ -1,17 +1 @@
.zan-toast {
position: fixed;
top: 35%;
left: 20%;
transform: translateZ(0) translateY(-100%);
background: rgba(0, 0, 0, 0.7);
color: #fff;
font-size: 14px;
width: 60%;
line-height: 1.5em;
margin: 0 auto;
box-sizing: border-box;
padding: 10px;
text-align: center;
border-radius: 4px;
z-index: 100;
}
.zan-toast{position:fixed;top:35%;left:20%;transform:translateZ(0) translateY(-100%);background:rgba(0,0,0,.7);color:#fff;font-size:14px;width:60%;line-height:1.5em;margin:0 auto;box-sizing:border-box;padding:10px;text-align:center;border-radius:4px;z-index:100}

23
dist/toptips/index.wxss vendored
View File

@ -1,22 +1 @@
.zan-toptips {
display: block;
position: fixed;
-webkit-transform: translateZ(0) translateY(-100%);
width: 100%;
/* 至少有一行的高度，保证第一次动画显示正常 */
min-height: 32px;
top: 0;
line-height: 2.3;
font-size: 14px;
text-align: center;
color: #FFF;
background-color: #E64340;
z-index: 110;
/* 动画部分 */
transition: all 0.4s ease;
}
.zan-toptips--show {
-webkit-transform: translateZ(0) translateY(0);
}
.zan-toptips{display:block;position:fixed;-webkit-transform:translateZ(0) translateY(-100%);width:100%;min-height:32px;top:0;line-height:2.3;font-size:14px;text-align:center;color:#fff;background-color:#e64340;z-index:110;transition:all .4s ease}.zan-toptips--show{-webkit-transform:translateZ(0) translateY(0)}

18
package.json
View File

@ -8,8 +8,11 @@
},
"scripts": {
"release": "sh build/release.sh",
"components": "node build/build-components.js --color",
"css": "gulp build --gulpfile build/build-css.js --color",
"changelog": "sh build/build-changelog.sh",
"icon": "sh build/build-icon.sh"
"icon": "sh build/build-icon.sh",
"dev": "node build/build-dev.js --color"
},
"repository": {
"type": "git",
@ -20,5 +23,16 @@
"bugs": {
"url": "https://github.com/youzan/zanui-weapp/issues"
},
"homepage": "https://github.com/youzan/zanui-weapp#readme"
"homepage": "https://github.com/youzan/zanui-weapp#readme",
"devDependencies": {
"fs-extra": "^4.0.2",
"gulp": "^3.9.1",
"gulp-clean-css": "^3.9.0",
"gulp-postcss": "^7.0.0",
"node-watch": "^0.5.5",
"postcss-calc": "^6.0.1",
"postcss-easy-import": "^3.0.0",
"precss": "^2.0.0",
"shelljs": "^0.7.8"
}
}

24
packages/badge/index.wxss Normal file
View File

@ -0,0 +1,24 @@
.zan-badge {
position: relative;
}
.zan-badge__count {
position: absolute;
top: -8px;
right: 0px;
height: 1.6em;
min-width: 1.6em;
line-height: 1.6;
padding: 0 .4em;
font-size: 10px;
font-family: tahoma;
border-radius: .8em;
background: #FF4444;
color: #fff;
text-align: center;
white-space: nowrap;
transform: translateX(50%);
transform-origin: -10% center;
z-index: 10;
box-shadow: 0 0 0 1px #fff;
box-sizing: border-box;
}

142
packages/btn/index.wxss Normal file
View File

@ -0,0 +1,142 @@
.zan-btn {
position: relative;
color: #333;
background-color: #fff;
margin-bottom: 10px;
padding-left: 15px;
padding-right: 15px;
border-radius: 2px;
border: 1rpx solid #e5e5e5;
font-size: 16px;
line-height: 45px;
height: 45px;
box-sizing: border-box;
text-decoration: none;
text-align: center;
vertical-align: middle;
}
.zan-btn::after {
display: none;
}
.zan-btns {
margin: 15px;
}
/* type */
.zan-btn--primary {
color: #fff;
background-color: #4b0;
border-color: #0a0;
}
.zan-btn--warn {
color: #fff;
background-color: #f85;
border-color: #f85;
}
.zan-btn--danger {
color: #fff;
background-color: #f44;
border-color: #e33;
}
/* size */
.zan-btn--small {
display: inline-block;
height: 30px;
line-height: 30px;
font-size: 12px;
margin-right: 5px;
margin-bottom: 0;
}
.zan-btn--mini {
display: inline-block;
line-height: 21px;
height: 22px;
font-size: 10px;
margin-right: 5px;
margin-bottom: 0;
padding-left: 5px;
padding-right: 5px;
}
.zan-btn--large {
border-radius: 0;
margin-bottom: 0;
border: none;
line-height: 50px;
height: 50px;
}
/* plain */
.zan-btn--plain.zan-btn {
background-color: transparent;
}
.zan-btn--plain.zan-btn--primary {
color: #06BF04;
}
.zan-btn--plain.zan-btn--warn {
color: #FF6600;
}
.zan-btn--plain.zan-btn--danger {
color: #FF4444;
}
/* 重写button组件的button-hover样式 */
.button-hover {
opacity: 0.9;
}
/* loading */
.zan-btn--loading {
color: transparent;
opacity: 1;
}
.zan-btn--loading::before {
position: absolute;
left: 50%;
top: 50%;
content: ' ';
width: 16px;
height: 16px;
margin-left: -8px;
margin-top: -8px;
border: 3px solid #e5e5e5;
border-color: #666 #e5e5e5 #e5e5e5 #e5e5e5;
border-radius: 8px;
box-sizing: border-box;
animation: btn-spin 0.6s linear;
animation-iteration-count: infinite;
}
.zan-btn--primary.zan-btn--loading::before,
.zan-btn--warn.zan-btn--loading::before,
.zan-btn--danger.zan-btn--loading::before {
border-color: #fff rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1);
}
@keyframes btn-spin {
0% {
transform: rotate(0);
}
100% {
transform: rotate(360deg);
}
}
/* disabled */
.zan-btn.zan-btn--disabled {
/* 防止样式被 button[disabled] 的规则覆盖，所以使用了important */
color: #999 ! important;
background: #f8f8f8 ! important;
border-color: #e5e5e5 ! important;
cursor: not-allowed ! important;
opacity: 1 ! important;
}
/* :last-child */
.zan-btn--last-child,
.zan-btn:last-child {
margin-bottom: 0;
margin-right: 0;
}

12
packages/capsule/index.wxml Normal file
View File

@ -0,0 +1,12 @@
<template name="capsule">
<view class="zan-capsule zan-capsule--{{type}}">
<block wx:if="{{color}}">
<view class="zan-capsule__left" style="background: {{ color }}; border-color: {{ color }}">{{ leftText }}</view>
<view class="zan-capsule__right" style="color: {{ color }}; border-color: {{ color }}">{{ rightText }}</view>
</block>
<block wx:else>
<view class="zan-capsule__left">{{ leftText }}</view>
<view class="zan-capsule__right">{{ rightText }}</view>
</block>
</view>
</template>

39
packages/capsule/index.wxss Normal file
View File

@ -0,0 +1,39 @@
.zan-capsule {
display: inline-block;
font-size: 12px;
vertical-align: middle;
line-height: 16px;
transform: scale(0.83);
}
.zan-capsule__left,
.zan-capsule__right {
display: inline-block;
line-height: 16px;
height: 16px;
vertical-align: middle;
box-sizing: border-box;
}
.zan-capsule__left {
padding: 0 2px;
color: #FFF;
background: #999;
border-radius: 2px 0 0 2px;
border: 1rpx solid #999;
}
.zan-capsule__right {
padding: 0 5px;
color: #999;
border-radius: 0 2px 2px 0;
border: 1rpx solid #999;
}
.zan-capsule--danger .zan-capsule__left {
color: #FFF;
background: #F24544;
border-color: #F24544;
}
.zan-capsule--danger .zan-capsule__right {
color: #F24544;
border-color: #F24544;
}

53
packages/card/index.wxss Normal file
View File

@ -0,0 +1,53 @@
.zan-card {
margin-left: 0px;
width: auto;
padding: 5px 15px;
overflow: hidden;
position: relative;
font-size: 14px;
}
.zan-card__thumb {
width: 90px;
height: 90px;
float: left;
position: relative;
margin-left: auto;
margin-right: auto;
overflow: hidden;
background-size: cover;
}
.zan-card__img {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
}
.zan-card__detail {
margin-left: 100px;
width: auto;
position: relative;
}
.zan-card__detail-row {
overflow: hidden;
line-height: 20px;
min-height: 20px;
margin-bottom: 3px;
}
.zan-card__right-col {
float: right;
}
.zan-card__left-col {
margin-right: 80px;
}

77
packages/cell/index.wxss Normal file
View File

@ -0,0 +1,77 @@
.zan-cell {
position: relative;
padding: 12px 15px;
display: flex;
align-items: center;
line-height: 1.4;
font-size: 14px;
}
.zan-cell::after {
position: absolute;
left: 15px;
right: 0;
bottom: 0;
border-top: 1rpx solid #e5e5e5;
background: #e5e5e5;
content: ' ';
}
.zan-cell__icon {
margin-right: 5px;
}
.zan-cell__bd {
flex: 1;
}
.zan-cell__text {
line-height: 24px;
font-size: 14px;
}
.zan-cell__desc {
line-height: 1.2;
font-size: 12px;
color: #666;
}
.zan-cell__ft {
position: relative;
text-align: right;
color: #666;
}
.zan-cell__no-pading{
padding: 0;
}
.zan-cell__no-pading .zan-cell__bd_padding {
padding: 12px 0 12px 15px;
}
.zan-cell__no-pading .zan-cell__bd_padding .zan-form__input{
height: 26px;
}
.zan-cell__no-pading .zan-cell__ft_padding {
padding: 12px 15px 12px 0;
}
.zan-cell--last-child::after,
.zan-cell:last-child::after {
display: none;
}
.zan-cell--access .zan-cell__ft {
padding-right: 13px;
}
.zan-cell--access .zan-cell__ft::after {
position: absolute;
top: 50%;
right: 2px;
content: " ";
display: inline-block;
height: 6px;
width: 6px;
border-width: 2px 2px 0 0;
border-color: #c8c8c8;
border-style: solid;
transform: translateY(-50%) matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
}
.zan-cell--switch {
padding-top: 6px;
padding-bottom: 6px;
}

27
packages/color/index.wxss Normal file
View File

@ -0,0 +1,27 @@
.zan-c-red {
color: #f44 !important;
}
.zan-c-gray {
color: #c9c9c9 !important;
}
.zan-c-gray-dark {
color: #999 !important;
}
.zan-c-gray-darker {
color: #666 !important;
}
.zan-c-black {
color: #333 !important;
}
.zan-c-blue {
color: #3283fa !important;
}
.zan-c-green {
color: #44BB00 !important;
}

27
packages/dialog/index.wxss Normal file
View File

@ -0,0 +1,27 @@
.zan-dialog__mask {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 10;
background: rgba(0, 0, 0, 0.7);
display: none;
}
.zan-dialog__container {
position: fixed;
left: 0;
bottom: 0;
width: 750rpx;
background: white;
transform: translateY(150%);
transition: all 0.4s ease;
z-index: 11;
}
.zan-dialog--show .zan-dialog__container {
transform: translateY(0);
}
.zan-dialog--show .zan-dialog__mask {
display: block;
}

14
packages/field/index.js Normal file
View File

@ -0,0 +1,14 @@
module.exports = {
_handleZanFieldChange(event) {
const { componentId } = event.currentTarget.dataset;
event.componentId = componentId;
console.info('[zan:field:change]', event);
if (this.handleZanFieldChange) {
this.handleZanFieldChange(event);
} else {
console.warn('页面缺少 handleZanFieldChange 回调函数');
}
}
};

23
packages/field/index.wxml Normal file
View File

@ -0,0 +1,23 @@
<template name="zan-field">
<view class="zan-cell zan-field {{ error ? 'zan-field--error' : '' }} {{ mode === 'wrapped' ? 'zan-field--wrapped' : '' }}">
<view
wx:if="{{ title }}"
class="zan-cell__hd zan-field__title">{{ title }}</view>
<textarea
wx:if="{{ type === 'textarea' }}"
auto-height
placeholder="{{ placeholder }}"
class="zan-field__input zan-cell__bd {{ right ? 'zan-field__input--right' : '' }}"
placeholder-class="zan-field__placeholder"
bindinput="_handleZanFieldChange"
data-component-id="{{ componentId }}"></textarea>
<input
wx:else
type="{{ inputType || 'text' }}"
placeholder="{{ placeholder }}"
class="zan-field__input zan-cell__bd {{ right ? 'zan-field__input--right' : '' }}"
placeholder-class="zan-field__placeholder"
bindinput="_handleZanFieldChange"
data-component-id="{{ componentId }}"/>
</view>
</template>

50
packages/field/index.wxss Normal file
View File

@ -0,0 +1,50 @@
@import '../cell/index.wxss';
.zan-field {
padding: 7px 15px;
color: #333;
}
.zan-field--wrapped {
margin: 0 15px;
border: 1rpx solid #e5e5e5;
border-radius: 8rpx;
background-color: #fff;
}
.zan-field--wrapped::after {
border: 0rpx;
}
.zan-field--wrapped + .zan-field--wrapped {
margin-top: 10px;
}
.zan-field--error {
/* 圆角输入框时，将边框也置红 */
border-color: #f40;
color: #f40;
}
.zan-field__title {
color: #333;
min-width: 65px;
padding-right: 10px;
}
.zan-field__input {
flex: 1;
line-height: 1.6;
padding: 4px 0;
min-height: 22px;
height: auto;
font-size: 14px;
}
.zan-field__placeholder {
font-size: 14px;
}
.zan-field__input--right {
text-align: right;
}

101
packages/helper/index.wxss Normal file
View File

@ -0,0 +1,101 @@
.zan-pull-left {
float: left;
}
.zan-pull-right {
float: right;
}
.zan-center {
text-align: center;
}
.zan-right {
text-align: right;
}
.zan-text-deleted {
text-decoration: line-through;
}
.zan-font-8 {
font-size: 8px;
}
.zan-font-10 {
font-size: 10px;
}
.zan-font-12 {
font-size: 12px;
}
.zan-font-14 {
font-size: 14px;
}
.zan-font-16 {
font-size: 16px;
}
.zan-font-18 {
font-size: 18px;
}
.zan-font-20 {
font-size: 20px;
}
.zan-font-22 {
font-size: 22px;
}
.zan-font-24 {
font-size: 22px;
}
.zan-font-30 {
font-size: 30px;
}
.zan-font-bold {
font-weight: bold;
}
.zan-arrow {
position: absolute;
right: 15px;
top: 50%;
display: inline-block;
height: 6px;
width: 6px;
border-width: 2px 2px 0 0;
border-color: #c8c8c8;
border-style: solid;
transform: translateY(-50%) matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
}
.zan-ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
word-wrap: normal;
}
.zan-ellipsis--l2 {
max-height: 40px;
line-height: 20px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.zan-ellipsis--l3 {
max-height: 60px;
line-height: 20px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
.zan-clearfix {
zoom: 1;
}
.zan-clearfix::after {
content: '';
display: table;
clear: both;
}

130
packages/icon/index.wxss Normal file
View File

@ -0,0 +1,130 @@
/* DO NOT EDIT! Generated by fount */
@font-face {
font-family: 'zanui-weapp-icon';
src: url('https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-9e9804afef.eot');
src: url('https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-9e9804afef.eot?#iefix') format('embedded-opentype'),
url('https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-9e9804afef.woff2') format('woff2'),
url('https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-9e9804afef.woff') format('woff'),
url('https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-9e9804afef.ttf') format('truetype')
}
.zan-icon {
display: inline-block;
}
.zan-icon::before {
font-family: "zanui-weapp-icon" !important;
font-style: normal;
font-weight: normal;
speak: none;
display: inline-block;
text-decoration: inherit;
width: 1em;
text-align: center;
/* For safety - reset parent styles, that can break glyph codes*/
font-variant: normal;
text-transform: none;
/* fix buttons height, for twitter bootstrap */
line-height: 1em;
/* Animation center compensation - margins should be symmetric */
/* remove if not needed */
/* margin-left: .2em; */
/* you can be more comfortable with increased icons size */
/* font-size: 120%; */
/* Font smoothing. That was taken from TWBS */
-webkit-font-smoothing: antialiased;
/* Uncomment for 3D effect */
/* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
/* DO NOT EDIT! Generated by iconfount */
.zan-icon-qr-invalid:before { content: '\e800'; } /* '' */
.zan-icon-qr:before { content: '\e801'; } /* '' */
.zan-icon-exchange:before { content: '\e802'; } /* '' */
.zan-icon-close:before { content: '\e803'; } /* '' */
.zan-icon-location:before { content: '\e804'; } /* '' */
.zan-icon-upgrade:before { content: '\e805'; } /* '' */
.zan-icon-check:before { content: '\e806'; } /* '' */
.zan-icon-checked:before { content: '\e807'; } /* '' */
.zan-icon-like-o:before { content: '\e808'; } /* '' */
.zan-icon-like:before { content: '\e809'; } /* '' */
.zan-icon-chat:before { content: '\e80a'; } /* '' */
.zan-icon-shop:before { content: '\e80b'; } /* '' */
.zan-icon-photograph:before { content: '\e80c'; } /* '' */
.zan-icon-add:before { content: '\e80d'; } /* '' */
.zan-icon-add2:before { content: '\e80e'; } /* '' */
.zan-icon-photo:before { content: '\e80f'; } /* '' */
.zan-icon-logistics:before { content: '\e810'; } /* '' */
.zan-icon-edit:before { content: '\e811'; } /* '' */
.zan-icon-passed:before { content: '\e812'; } /* '' */
.zan-icon-shopping-cart:before { content: '\e813'; } /* '' */
.zan-icon-arrow:before { content: '\e814'; } /* '' */
.zan-icon-gift:before { content: '\e815'; } /* '' */
.zan-icon-search:before { content: '\e816'; } /* '' */
.zan-icon-clear:before { content: '\e817'; } /* '' */
.zan-icon-success:before { content: '\e818'; } /* '' */
.zan-icon-fail:before { content: '\e819'; } /* '' */
.zan-icon-contact:before { content: '\e81a'; } /* '' */
.zan-icon-wechat:before { content: '\e81b'; } /* '' */
.zan-icon-alipay:before { content: '\e81c'; } /* '' */
.zan-icon-password-view:before { content: '\e81d'; } /* '' */
.zan-icon-password-not-view:before { content: '\e81e'; } /* '' */
.zan-icon-wap-nav:before { content: '\e81f'; } /* '' */
.zan-icon-wap-home:before { content: '\e820'; } /* '' */
.zan-icon-ecard-pay:before { content: '\e821'; } /* '' */
.zan-icon-balance-pay:before { content: '\e822'; } /* '' */
.zan-icon-peer-pay:before { content: '\e823'; } /* '' */
.zan-icon-credit-pay:before { content: '\e824'; } /* '' */
.zan-icon-debit-pay:before { content: '\e825'; } /* '' */
.zan-icon-other-pay:before { content: '\e826'; } /* '' */
.zan-icon-cart:before { content: '\e827'; } /* '' */
.zan-icon-browsing-history:before { content: '\e828'; } /* '' */
.zan-icon-goods-collect:before { content: '\e829'; } /* '' */
.zan-icon-shop-collect:before { content: '\e82a'; } /* '' */
.zan-icon-receive-gift:before { content: '\e82b'; } /* '' */
.zan-icon-send-gift:before { content: '\e82c'; } /* '' */
.zan-icon-setting:before { content: '\e82d'; } /* '' */
.zan-icon-points:before { content: '\e82e'; } /* '' */
.zan-icon-coupon:before { content: '\e82f'; } /* '' */
.zan-icon-free-postage:before { content: '\e830'; } /* '' */
.zan-icon-discount:before { content: '\e831'; } /* '' */
.zan-icon-birthday-privilege:before { content: '\e832'; } /* '' */
.zan-icon-member-day-privilege:before { content: '\e833'; } /* '' */
.zan-icon-balance-details:before { content: '\e834'; } /* '' */
.zan-icon-cash-back-record:before { content: '\e835'; } /* '' */
.zan-icon-points-mall:before { content: '\e836'; } /* '' */
.zan-icon-exchange-record:before { content: '\e837'; } /* '' */
.zan-icon-pending-payment:before { content: '\e838'; } /* '' */
.zan-icon-pending-orders:before { content: '\e839'; } /* '' */
.zan-icon-pending-deliver:before { content: '\e83a'; } /* '' */
.zan-icon-pending-evaluate:before { content: '\e83b'; } /* '' */
.zan-icon-gift-card-pay:before { content: '\e83c'; } /* '' */
.zan-icon-cash-on-deliver:before { content: '\e83d'; } /* '' */
.zan-icon-underway:before { content: '\e83e'; } /* '' */
.zan-icon-point-gift:before { content: '\e83f'; } /* '' */
.zan-icon-after-sale:before { content: '\e840'; } /* '' */
.zan-icon-edit-data:before { content: '\e841'; } /* '' */
.zan-icon-question:before { content: '\e842'; } /* '' */
.zan-icon-delete:before { content: '\e843'; } /* '' */
.zan-icon-records:before { content: '\e844'; } /* '' */
.zan-icon-description:before { content: '\e845'; } /* '' */
.zan-icon-card:before { content: '\e846'; } /* '' */
.zan-icon-gift-card:before { content: '\e847'; } /* '' */
.zan-icon-coupon:before { content: '\e848'; } /* '' */
.zan-icon-clock:before { content: '\e849'; } /* '' */
.zan-icon-gold-coin:before { content: '\e84a'; } /* '' */
.zan-icon-completed:before { content: '\e84b'; } /* '' */
.zan-icon-value-card:before { content: '\e84c'; } /* '' */
.zan-icon-certificate:before { content: '\e84d'; } /* '' */
.zan-icon-tosend:before { content: '\e84e'; } /* '' */
.zan-icon-sign:before { content: '\e84f'; } /* '' */
.zan-icon-home:before { content: '\e850'; } /* '' */
.zan-icon-phone:before { content: '\e851'; } /* '' */

8
packages/index.js Normal file
View File

@ -0,0 +1,8 @@
exports.CheckLabel = require('./select/index');
exports.Field = require('./field/index');
exports.NoticeBar = require('./noticebar/index');
exports.Quantity = require('./quantity/index');
exports.Switch = require('./switch/index');
exports.Tab = require('./tab/index');
exports.Toast = require('./toast/index');
exports.TopTips = require('./toptips/index');

22
packages/index.wxss Normal file
View File

@ -0,0 +1,22 @@
@import "badge/index.wxss";
@import "btn/index.wxss";
@import "capsule/index.wxss";
@import "card/index.wxss";
@import "cell/index.wxss";
@import "color/index.wxss";
@import "dialog/index.wxss";
@import "field/index.wxss";
@import "helper/index.wxss";
@import "icon/index.wxss";
@import "label/index.wxss";
@import "loadmore/index.wxss";
@import "noticebar/index.wxss";
@import "panel/index.wxss";
@import "popup/index.wxss";
@import "quantity/index.wxss";
@import "select/index.wxss";
@import "steps/index.wxss";
@import "switch/index.wxss";
@import "tab/index.wxss";
@import "toast/index.wxss";
@import "toptips/index.wxss";

34
packages/label/index.wxss Normal file
View File

@ -0,0 +1,34 @@
.zan-label {
display: inline-block;
font-size: 12px;
height: 28px;
line-height: 28px;
color: #333;
border: 1rpx solid #999;
padding: 0px 10px;
border-radius: 2px;
margin-right: 10px;
box-sizing: border-box;
vertical-align: middle;
text-align: center;
}
.zan-label--primary {
color: #fff;
background: #f44;
border: 1rpx solid #f44;
}
.zan-label--disabled {
color: #cacaca;
background: #eee;
border: 1rpx solid #e5e5e5;
}
.zan-label--small {
font-size: 11px;
height: 16px;
line-height: 16px;
padding: 0px 3px;
}
.zan-label--plain.zan-label--primary {
color: #f44;
background: #fff;
}

24
packages/loadmore/index.wxml Normal file
View File

@ -0,0 +1,24 @@
<template name="zan-loadmore">
<block wx:if="{{nomore}}">
<view class="zan-loadmore zan-loadmore--nomore">
<view class="zan-loadmore__tips">
<view class="zan-loadmore__dot"></view>
</view>
</view>
</block>
<block wx:elif="{{nodata}}">
<view class="zan-loadmore zan-loadmore--nodata">
<view class="zan-loadmore__tips">{{ nodata_str || '暂无数据' }}</view>
</view>
</block>
<block wx:elif="{{loading}}">
<view class="zan-loadmore">
<view class="zan-loading"></view>
<view class="zan-loadmore__tips">加载中...</view>
</view>
</block>
</template>

70
packages/loadmore/index.wxss Normal file
View File

@ -0,0 +1,70 @@
.zan-loadmore {
position: relative;
width: 65%;
margin: 21px auto;
line-height: 20px;
font-size: 14px;
text-align: center;
vertical-align: middle;
}
.zan-loading {
width:20px;
height:20px;
display: inline-block;
vertical-align: middle;
animation: weuiLoading 1s steps(12, end) infinite;
background: transparent url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iciIgd2lkdGg9JzEyMHB4JyBoZWlnaHQ9JzEyMHB4JyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj4KICAgIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAiIGhlaWdodD0iMTAwIiBmaWxsPSJub25lIiBjbGFzcz0iYmsiPjwvcmVjdD4KICAgIDxyZWN0IHg9JzQ2LjUnIHk9JzQwJyB3aWR0aD0nNycgaGVpZ2h0PScyMCcgcng9JzUnIHJ5PSc1JyBmaWxsPScjRTlFOUU5JwogICAgICAgICAgdHJhbnNmb3JtPSdyb3RhdGUoMCA1MCA1MCkgdHJhbnNsYXRlKDAgLTMwKSc+CiAgICA8L3JlY3Q+CiAgICA8cmVjdCB4PSc0Ni41JyB5PSc0MCcgd2lkdGg9JzcnIGhlaWdodD0nMjAnIHJ4PSc1JyByeT0nNScgZmlsbD0nIzk4OTY5NycKICAgICAgICAgIHRyYW5zZm9ybT0ncm90YXRlKDMwIDUwIDUwKSB0cmFuc2xhdGUoMCAtMzApJz4KICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0naW5kZWZpbml0ZScvPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyM5Qjk5OUEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSg2MCA1MCA1MCkgdHJhbnNsYXRlKDAgLTMwKSc+CiAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9J2luZGVmaW5pdGUnLz4KICAgIDwvcmVjdD4KICAgIDxyZWN0IHg9JzQ2LjUnIHk9JzQwJyB3aWR0aD0nNycgaGVpZ2h0PScyMCcgcng9JzUnIHJ5PSc1JyBmaWxsPScjQTNBMUEyJwogICAgICAgICAgdHJhbnNmb3JtPSdyb3RhdGUoOTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNBQkE5QUEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxMjAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNCMkIyQjInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxNTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNCQUI4QjknCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgxODAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNDMkMwQzEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyMTAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNDQkNCQ0InCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyNDAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNEMkQyRDInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgyNzAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNEQURBREEnCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgzMDAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0PgogICAgPHJlY3QgeD0nNDYuNScgeT0nNDAnIHdpZHRoPSc3JyBoZWlnaHQ9JzIwJyByeD0nNScgcnk9JzUnIGZpbGw9JyNFMkUyRTInCiAgICAgICAgICB0cmFuc2Zvcm09J3JvdGF0ZSgzMzAgNTAgNTApIHRyYW5zbGF0ZSgwIC0zMCknPgogICAgPC9yZWN0Pgo8L3N2Zz4=) no-repeat;
-webkit-background-size: 100%;
background-size: 100%;
}
.zan-loadmore .zan-loading {
margin-right: 4px;
}
.zan-loadmore__tips {
display: inline-block;
vertical-align: middle;
height: 20px;
line-height: 20px;
}
.zan-loadmore--nodata,
.zan-loadmore--nomore {
border-top: 1rpx solid #e5e5e5;
color: #999;
}
.zan-loadmore--nodata {
margin-top: 120px;
}
.zan-loadmore--nodata .zan-loadmore__tips {
position: relative;
top: -11px;
background: #f9f9f9;
padding: 0 6px;
}
.zan-loadmore--nomore .zan-loadmore__tips {
position: relative;
top: -11px;
background: #f9f9f9;
padding: 0 6px;
}
.zan-loadmore__dot {
position: absolute;
left: 50%;
top: 10px;
margin-left: -2px;
margin-top: -2px;
content: " ";
width: 4px;
height: 4px;
border-radius: 50%;
background-color: #E5E5E5;
display: inline-block;
vertical-align: middle;
}

55
packages/noticebar/index.js Normal file
View File

@ -0,0 +1,55 @@
var ZanNoticeBar = {
initZanNoticeBarScroll: function (componentId) {
this.zanNoticeBarNode = this.zanNoticeBarNode || {};
this.zanNoticeBarNode[`${componentId}`] = {
width: undefined,
wrapWidth: undefined,
animation: null,
resetAnimation: null
};
var currentComponent = this.zanNoticeBarNode[`${componentId}`];
var _this = this;
wx.createSelectorQuery().select(`#${componentId}__content`).boundingClientRect(function (rect) {
if (rect.width) {
currentComponent.width = rect.width;
wx.createSelectorQuery().select(`#${componentId}__content-wrap`).boundingClientRect(function (rect) {
currentComponent.wrapWidth = rect.width;
if (currentComponent.wrapWidth < currentComponent.width) {
var mstime = currentComponent.width / 40 * 1000;
currentComponent.animation = wx.createAnimation({
duration: mstime,
timingFunction: 'linear'
});
currentComponent.resetAnimation = wx.createAnimation({
duration: 0,
timingFunction: 'linear'
});
_this.scrollZanNoticeBar(componentId, mstime);
}
}).exec();
} else {
console.warn('页面缺少 noticebar 元素');
}
}).exec();
},
scrollZanNoticeBar: function (componentId, mstime) {
var currentComponent = this.zanNoticeBarNode[`${componentId}`];
var resetAnimationData = currentComponent.resetAnimation.translateX(currentComponent.wrapWidth).step();
this.setData({
[`${componentId}.animationData`]: resetAnimationData.export()
});
var aninationData = currentComponent.animation.translateX(-mstime * 40 / 1000).step();
var _this = this;
setTimeout(function () {
_this.setData({
[`${componentId}.animationData`]: aninationData.export()
});
}, 100);
setTimeout(function () {
_this.scrollZanNoticeBar(componentId, mstime);
}, mstime);
}
};
module.exports = ZanNoticeBar;

16
packages/noticebar/index.wxml Normal file
View File

@ -0,0 +1,16 @@
<template name="zan-noticebar">
<view class="zan-noticebar">
<view
id="{{ componentId }}__content-wrap"
style="height: 18px; overflow: hidden; position: relative;"
>
<view
animation="{{ animationData }}"
id="{{ componentId }}__content"
style="position: absolute; white-space: nowrap;"
>
{{ text }}
</view>
</view>
</view>
</template>

7
packages/noticebar/index.wxss Normal file
View File

@ -0,0 +1,7 @@
.zan-noticebar {
color: #f60;
padding: 9px 10px;
font-size: 12px;
line-height: 1.5;
background-color: #fff7cc;
}

19
packages/panel/index.wxss Normal file
View File

@ -0,0 +1,19 @@
.zan-panel {
background: #fff;
border-top: 1rpx solid #e5e5e5;
border-bottom: 1rpx solid #e5e5e5;
margin-top: 10px;
overflow: hidden;
}
.zan-panel-title {
font-size: 14px;
line-height: 1;
color: #999;
padding: 20px 15px 0 15px;
}
.zan-panel--without-margin-top {
margin-top: 0;
}

31
packages/popup/index.wxss Normal file
View File

@ -0,0 +1,31 @@
.zan-popup {
position: fixed;
background-color: #fff;
width: 100%;
height: 100%;
top: 50%;
left: 50%;
transform: translate3d(-50%, -50%, 0);
transition: .2s ease-out;
}
.zan-popup--top {
width: 100%;
top: 0;
right: auto;
bottom: auto;
left: 50%;
transform: translate3d(-50%, 0, 0);
}
.zan-popup--right {
transform: translate3d(50%, -50%, 0);
}
.zan-popup--left {
transform: translate3d(-150%, -50%, 0);
}
.zan-popup--show {
transform: translate3d(-50%, -50%, 0);
}

61
packages/quantity/index.js Normal file
View File

@ -0,0 +1,61 @@
function handle(e, num) {
var dataset = e.currentTarget.dataset;
var componentId = dataset.componentId;
var disabled = dataset.disabled;
var quantity = +dataset.quantity;
if (disabled) return null;
callback.call(this, componentId, quantity + num);
}
function callback(componentId, quantity) {
quantity = +quantity;
var e = { componentId, quantity };
console.info('[zan:quantity:change]', e);
if (this.handleZanQuantityChange) {
this.handleZanQuantityChange(e);
} else {
console.warn('页面缺少 handleZanQuantityChange 回调函数');
}
}
var Quantity = {
_handleZanQuantityMinus(e) {
handle.call(this, e, -1);
},
_handleZanQuantityPlus(e) {
handle.call(this, e, +1);
},
_handleZanQuantityBlur(e) {
var dataset = e.currentTarget.dataset;
var componentId = dataset.componentId;
var max = +dataset.max;
var min = +dataset.min;
var value = e.detail.value;
if (!value) {
setTimeout(() => {
callback.call(this, componentId, min);
}, 16);
callback.call(this, componentId, value);
return '' + value;
}
value = +value;
if (value > max) {
value = max;
} else if (value < min) {
value = min;
}
callback.call(this, componentId, value);
return '' + value;
}
};
module.exports = Quantity;

28
packages/quantity/index.wxml Normal file
View File

@ -0,0 +1,28 @@
<template name="zan-quantity">
<view class="zan-quantity {{ size === 'small' ? 'zan-quantity--small' : '' }}">
<view
class="zan-quantity__minus {{ quantity <= min ? 'zan-quantity--disabled' : '' }}"
data-component-id="{{ componentId }}"
data-quantity="{{ quantity }}"
data-disabled="{{ quantity <= min }}"
bindtap="_handleZanQuantityMinus"
>-</view>
<input
class="zan-quantity__text {{ min >= max ? 'zan-quantity--disabled' : '' }}"
type="number"
data-component-id="{{ componentId }}"
data-min="{{ min }}"
data-max="{{ max }}"
value="{{ quantity }}"
disabled="{{ min >= max }}"
bindblur="_handleZanQuantityBlur"
></input>
<view
class="zan-quantity__plus {{ quantity >= max ? 'zan-quantity--disabled' : '' }}"
data-component-id="{{ componentId }}"
data-quantity="{{ quantity }}"
data-disabled="{{ quantity >= max }}"
bindtap="_handleZanQuantityPlus"
>+</view>
</view>
</template>

46
packages/quantity/index.wxss Normal file
View File

@ -0,0 +1,46 @@
.zan-quantity {
color: #666;
}
.zan-quantity view {
display: inline-block;
line-height: 20px;
padding: 5px 0;
text-align: center;
min-width: 40px;
box-sizing: border-box;
vertical-align: middle;
font-size: 12px;
border: 1rpx solid #999;
}
.zan-quantity .zan-quantity__minus {
border-right: none;
border-radius: 2px 0 0 2px;
}
.zan-quantity .zan-quantity__text {
border: 1rpx solid #999;
display: inline-block;
text-align: center;
vertical-align: middle;
height: 30px;
width: 40px;
font-size: 12px;
line-height: 30px;
}
.zan-quantity .zan-quantity__plus {
border-left: none;
border-radius: 0 2px 2px 0;
}
.zan-quantity .zan-quantity--disabled {
background: #f8f8f8;
color: #bbb;
border-color: #e8e8e8;
}
.zan-quantity--small view {
min-width: 36px;
line-height: 18px;
}
.zan-quantity--small .zan-quantity__text {
width: 36px;
line-height: 28px;
height: 28px;
}

26
packages/select/index.js Normal file
View File

@ -0,0 +1,26 @@
function handle(e) {
var dataset = e.currentTarget.dataset;
var componentId = dataset.componentId;
var value = e.detail.value;
callback.call(this, componentId, value);
}
function callback(componentId, value) {
var e = { componentId, value };
console.info('[zan:Select:change]', e);
if (this.handleZanSelectChange) {
this.handleZanSelectChange(e);
} else {
console.warn('页面缺少 handleZanSelectChange 回调函数');
}
}
var Select = {
_handleZanSelectChange(e) {
handle.call(this, e);
},
};
module.exports = Select;

38
packages/select/index.wxml Normal file
View File

@ -0,0 +1,38 @@
<template name="zan-select">
<radio-group class="zan-select__list" bindchange="_handleZanSelectChange" data-component-id="{{ componentId }}">
<label wx:for="{{ items }}" wx:key="value">
<view class="zan-cell">
<radio class="zan-select__radio" value="{{ item.value }}" checked="{{ item.value === checkedValue }}"/>
<view
class="zan-cell__bd"
style="{{ parse.getItemStyle(item, checkedValue, activeColor) }}"
>{{ item.name }}</view>
<view wx:if="{{ item.value === checkedValue }}" class="zan-cell__ft">
<icon type="success_no_circle" color="{{ parse.getColor(activeColor) }}" size="14"></icon>
</view>
</view>
</label>
</radio-group>
</template>
<wxs module="parse">
function getColor(color) {
color = color || '#ff4444'
return color;
}
module.exports = {
getColor: getColor,
getItemStyle: function(item, checkedValue, activeColor) {
var padding = item.padding * 10;
var style = 'padding-left: ' + padding + 'px;';
// 如果为选中状态，则高亮
if (item.value === checkedValue) {
style += 'color: ' + getColor(activeColor);
}
return style;
}
};
</wxs>

3
packages/select/index.wxss Normal file
View File

@ -0,0 +1,3 @@
.zan-select__list .zan-select__radio{
display: none;
}

15
packages/steps/index.wxml Normal file
View File

@ -0,0 +1,15 @@
<template name="zan-steps">
<view class="zan-steps zan-steps--{{ type == 'vertical' ? 'vsteps' : 'steps' }} zan-steps--{{ steps.length }} {{ className }}">
<view
wx:for="{{ steps }}" wx:for-item="step" wx:key="unique" wx:for-index="index"
class="zan-steps__step {{ hasDesc ? 'zan-steps__step--db-title' : '' }} {{ index == 0 ? 'zan-steps__step--first-child' : '' }} {{ index == steps.length - 1 ? 'zan-steps__step--last-child' : '' }} {{ step.done ? 'zan-steps__step--done' : '' }} {{ step.current ? 'zan-steps__step--cur' : '' }}"
>
<view class="zan-steps__title">{{ step.text }}</view>
<view wx:if="{{ hasDesc && step.desc }}" class="zan-steps__title zan-steps__title--desc">{{ step.desc }}</view>
<view class="zan-steps__icons">
<view class="zan-steps__circle"></view>
</view>
<view class="zan-steps__line"></view>
</view>
</view>
</template>

6
packages/steps/index.wxss Normal file
View File

@ -0,0 +1,6 @@
@import "wxss/step.wxss";
@import "wxss/vstep.wxss";
.zan-steps {
position: relative;
}

133
packages/steps/wxss/step.wxss Normal file
View File

@ -0,0 +1,133 @@
.zan-steps--steps.zan-steps--5 .zan-steps__step {
width: 25%;
}
.zan-steps--steps.zan-steps--4 .zan-steps__step {
width: 33%;
}
.zan-steps--steps.zan-steps--3 .zan-steps__step {
width: 50%;
}
.zan-steps--steps .zan-steps__step {
position: relative;
float: left;
padding-bottom: 25px;
color: #b1b1b1;
}
.zan-steps--steps .zan-steps__title {
transform: translateX(-50%);
font-size: 10px;
text-align: center;
}
.zan-steps--steps .zan-steps__icons {
position: absolute;
top: 30px;
left: -10px;
padding: 0 8px;
background-color: #fff;
z-index: 10;
}
.zan-steps--steps .zan-steps__circle {
display: block;
position: relative;
width: 5px;
height: 5px;
background-color: #e5e5e5;
border-radius: 50%;
}
.zan-steps--steps .zan-steps__line {
position: absolute;
left: 0px;
top: 32px;
width: 100%;
height: 1px;
background-color: #e5e5e5;
}
/* 已完成的steps */
.zan-steps--steps .zan-steps__step--done {
color: #333;
}
.zan-steps--steps .zan-steps__step--done .zan-steps__line {
background-color: #06bf04;
}
.zan-steps--steps .zan-steps__step--done .zan-steps__circle {
width: 5px;
height: 5px;
background-color: #09bb07;
}
/* 正在进行中的steps */
.zan-steps--steps .zan-steps__step--cur .zan-steps__icons {
top: 25px;
left: -14px;
}
.zan-steps--steps .zan-steps__step--cur .zan-steps__circle {
width: 13px;
height: 13px;
background-image: url("https://b.yzcdn.cn/v2/image/wap/success_small@2x.png");
background-size: 13px 13px;
}
.zan-steps--steps .zan-steps__step--cur .zan-steps__line {
background-color: #e5e5e5;
}
/* 各种不同位置的 */
.zan-steps--steps .zan-steps__step--first-child .zan-steps__title {
margin-left: 0;
transform: none;
text-align: left;
}
.zan-steps--steps .zan-steps__step--first-child .zan-steps__icons {
left: -7px;
}
.zan-steps--steps .zan-steps__step--last-child {
position: absolute;
right: 0;
top: 0;
text-align: right;
}
.zan-steps--steps .zan-steps__step--last-child .zan-steps__title {
transform: none;
text-align: right;
}
.zan-steps--steps .zan-steps__step--last-child .zan-steps__icons {
left: auto;
right: -6px;
}
.zan-steps--steps .zan-steps__step--last-child .zan-steps__line {
display: none;
}
/* 有描述的step */
.zan-steps--steps .zan-steps__step--db-title {
min-height: 29px;
}
.zan-steps--steps .zan-steps__step--db-title .zan-steps__line {
top: 45px;
}
.zan-steps--steps .zan-steps__step--db-title .zan-steps__icons {
top: 43px;
}
.zan-steps--steps .zan-steps__step--db-title.zan-steps__step--cur .zan-steps__icons {
top: 39px;
}

90
packages/steps/wxss/vstep.wxss Normal file
View File

@ -0,0 +1,90 @@
.zan-steps--vsteps {
color: #999;
font-size: 14px;
}
.zan-steps--vsteps .zan-steps__step {
position: relative;
padding: 15px 0;
}
.zan-steps--vsteps .zan-steps__step--done {
color: #44BB00;
}
.zan-steps--vsteps .zan-steps__line {
position: absolute;
top: 0;
bottom: 0;
left: 7px;
width: 1px;
background-color: #e5e5e5;
}
.zan-steps--vsteps .zan-steps__title {
display: inline-block;
line-height: 20px;
padding-left: 27px;
}
.zan-steps--vsteps .zan-steps__title--desc {
padding-left: 3px;
}
.zan-steps--vsteps .zan-steps__icons {
position: absolute;
left: 7px;
top: 50%;
transform: translate(-50%, -50%);
z-index: 2;
padding: 3px 0;
background-color: #fff;
}
.zan-steps--vsteps .zan-steps__circle {
width: 5px;
height: 5px;
background-color: #cacaca;
border-radius: 10px;
}
.zan-steps--vsteps .zan-steps__step--done .zan-steps__circle {
width: 5px;
height: 5px;
background-color: #09bb07;
}
.zan-steps--vsteps .zan-steps__step--cur .zan-steps__circle {
width: 13px;
height: 13px;
background: transparent url("https://b.yzcdn.cn/v2/image/wap/success_small@2x.png");
background-size: 13px 13px;
border-radius:0;
}
.zan-steps--vsteps .zan-steps__icon--active {
width: 13px;
height: 13px;
}
.zan-steps--vsteps .zan-steps__step--first-child .zan-steps__title::before {
content: '';
position: absolute;
top: 0;
bottom: 50%;
left: 7px;
width: 1px;
background-color: #fff;
z-index: 1;
}
.zan-steps--vsteps .zan-steps__step--last-child .zan-steps__title::after {
content: '';
position: absolute;
top: 50%;
bottom: 0%;
left: 7px;
width: 1px;
background-color: #fff;
z-index: 1;
}

25
packages/switch/index.js Normal file
View File

@ -0,0 +1,25 @@
var Switch = {
_handleZanSwitchChange(e) {
var dataset = e.currentTarget.dataset;
var checked = !dataset.checked;
var loading = dataset.loading;
var disabled = dataset.disabled;
var componentId = dataset.componentId;
if (loading || disabled) return;
console.info('[zan:switch:change]', { checked, componentId });
if (this.handleZanSwitchChange) {
this.handleZanSwitchChange({
checked,
componentId
});
} else {
console.warn('页面缺少 handleZanSwitchChange 回调函数');
}
}
};
module.exports = Switch;

15
packages/switch/index.wxml Normal file
View File

@ -0,0 +1,15 @@
<template name="zan-switch">
<view
class="zan-switch zan-switch--{{ checked ? 'on' : 'off' }} {{ disabled ? 'zan-swtich--disabled' : '' }}"
data-checked="{{ checked }}"
data-loading="{{ loading }}"
data-disabled="{{ disabled }}"
data-component-id="{{ componentId }}"
bindtap="_handleZanSwitchChange"
>
<view class="zan-switch__circle">
<view hidden="{{ !loading }}" class="zan-switch__loading"></view>
</view>
<view class="zan-switch__bg"></view>
</view>
</template>

69
packages/switch/index.wxss Normal file
View File

@ -0,0 +1,69 @@
.zan-switch {
position: relative;
display: inline-block;
width: 52px;
height: 32px;
vertical-align: middle;
box-sizing: border-box;
border-radius: 16px;
background: #44DB5E;
border: 1px solid #44DB5E;
}
.zan-switch__circle {
position: absolute;
top: 0;
left: 0;
width: 30px;
height: 30px;
display: inline-block;
background: #fff;
border-radius: 15px;
box-sizing: border-box;
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05);
transition: transform 0.35s cubic-bezier(0.45, 1, 0.4, 1);
z-index: 2;
}
.zan-switch__bg {
position: absolute;
top: -1px;
left: -1px;
width: 52px;
height: 32px;
background: #fff;
border-radius: 26px;
display: inline-block;
border: 1px solid #e5e5e5;
box-sizing: border-box;
transition: transform 0.35s cubic-bezier(0.45, 1, 0.4, 1);
transform: scale(0);
transform-origin: 36px 16px;
}
.zan-switch--on .zan-switch__circle {
transform: translateX(20px);
}
.zan-switch--off .zan-switch__bg {
transform: scale(1);
}
.zan-swtich--disabled {
opacity: 0.4;
}
.zan-switch__loading {
position: absolute;
left: 7px;
top: 7px;
width: 16px;
height: 16px;
background: url(https://img.yzcdn.cn/public_files/2017/02/24/9acec77d91106cd15b8107c4633d9155.png) no-repeat;
background-size: 16px 16px;
animation: zan-switch-loading 0.8s infinite linear;
}
@keyframes zan-switch-loading {
from {
transform: rotate(0);
}
to {
transform: rotate(360deg);
}
}

17
packages/tab/index.js Normal file
View File

@ -0,0 +1,17 @@
var Tab = {
_handleZanTabChange(e) {
var dataset = e.currentTarget.dataset;
var componentId = dataset.componentId;
var selectedId = dataset.itemId;
var data = { componentId, selectedId };
console.info('[zan:tab:change]', data);
if (this.handleZanTabChange) {
this.handleZanTabChange(data);
} else {
console.warn('页面缺少 handleZanTabChange 回调函数');
}
}
};
module.exports = Tab;

31
packages/tab/index.wxml Normal file
View File

@ -0,0 +1,31 @@
<template name="zan-tab">
<view class="zan-tab">
<block wx:if="{{tab.scroll}}">
<scroll-view
class="zan-tab__bd zan-tab__bd--scroll {{ fixed ? 'zan-tab__bd--fixed' : '' }}"
scroll-x="true"
style="height: {{ tab.height ? tab.height + 'px' : 'auto' }}"
>
<template is="zan-tab-list" data="{{ tab, componentId }}"></template>
</scroll-view>
</block>
<block wx:else>
<view class="zan-tab__bd {{fixed ? 'zan-tab__bd--fixed' : ''}}">
<template is="zan-tab-list" data="{{ tab, componentId }}"></template>
</view>
</block>
</view>
</template>
<template name="zan-tab-list">
<view
wx:for="{{tab.list}}"
wx:key="id"
class="zan-tab__item {{tab.selectedId == item.id ? 'zan-tab__item--selected' : ''}}"
data-component-id="{{componentId}}"
data-item-id="{{item.id}}"
bindtap="_handleZanTabChange"
>
<view class="zan-tab__title">{{item.title}}</view>
</view>
</template>

48
packages/tab/index.wxss Normal file
View File

@ -0,0 +1,48 @@
.zan-tab {
height: 45px;
}
.zan-tab__bd {
width: 750rpx;
display: flex;
flex-direction: row;
border-bottom: 1rpx solid #e5e5e5;
background: #fff;
}
.zan-tab__bd--fixed {
position: fixed;
top: 0;
z-index: 2;
}
.zan-tab__item {
flex: 1;
display: inline-block;
text-align: center;
box-sizing: border-box;
}
.zan-tab__title {
font-size: 14px;
display: inline-block;
color: #666;
height: 44px;
line-height: 44px;
box-sizing: border-box;
margin: 0 10px;
word-break: keep-all;
}
.zan-tab__item--selected .zan-tab__title {
color: #f44;
border-bottom: 2px solid #f44;
}
.zan-tab__bd--scroll {
display: block;
white-space: nowrap;
}
.zan-tab__bd--scroll .zan-tab__item {
min-width: 80px;
}
.zan-tab__bd--scroll .zan-tab__text {
margin: 0 20px;
}

32
packages/toast/index.js Normal file
View File

@ -0,0 +1,32 @@
module.exports = {
showZanToast(title, timeout) {
var zanToast = this.data.zanToast || {};
clearTimeout(zanToast.timer);
// 弹层设置~
zanToast = {
show: true,
title
};
this.setData({
zanToast
});
var timer = setTimeout(() => {
this.clearZanToast();
}, timeout || 3000);
this.setData({
'zanToast.timer': timer
});
},
clearZanToast() {
var zanToast = this.data.zanToast || {};
clearTimeout(zanToast.timer);
this.setData({
'zanToast.show': false
});
}
};

3
packages/toast/index.wxml Normal file
View File

@ -0,0 +1,3 @@
<template name="zan-toast">
<view class="zan-toast" wx:if="{{ zanToast.show }}" bindtap="clearZanToast">{{ zanToast.title }}</view>
</template>

17
packages/toast/index.wxss Normal file
View File

@ -0,0 +1,17 @@
.zan-toast {
position: fixed;
top: 35%;
left: 20%;
transform: translateZ(0) translateY(-100%);
background: rgba(0, 0, 0, 0.7);
color: #fff;
font-size: 14px;
width: 60%;
line-height: 1.5em;
margin: 0 auto;
box-sizing: border-box;
padding: 10px;
text-align: center;
border-radius: 4px;
z-index: 100;
}

39
packages/toptips/index.js Normal file
View File

@ -0,0 +1,39 @@
module.exports = {
showZanTopTips(content = '', options = {}) {
let zanTopTips = this.data.zanTopTips || {};
// 如果已经有一个计时器在了，就清理掉先
if (zanTopTips.timer) {
clearTimeout(zanTopTips.timer);
zanTopTips.timer = undefined;
}
if (typeof options === 'number') {
options = {
duration: options
};
}
// options参数默认参数扩展
options = Object.assign({
duration: 3000
}, options);
// 设置定时器，定时关闭topTips
let timer = setTimeout(() => {
this.setData({
'zanTopTips.show': false,
'zanTopTips.timer': undefined
});
}, options.duration);
// 展示出topTips
this.setData({
zanTopTips: {
show: true,
content,
options,
timer
}
});
}
};

3
packages/toptips/index.wxml Normal file
View File

@ -0,0 +1,3 @@
<template name="zan-toptips">
<view class="zan-toptips {{ zanTopTips.show ? 'zan-toptips--show' : '' }}">{{ zanTopTips.content }}</view>
</template>

22
packages/toptips/index.wxss Normal file
View File

@ -0,0 +1,22 @@
.zan-toptips {
display: block;
position: fixed;
-webkit-transform: translateZ(0) translateY(-100%);
width: 100%;
/* 至少有一行的高度，保证第一次动画显示正常 */
min-height: 32px;
top: 0;
line-height: 2.3;
font-size: 14px;
text-align: center;
color: #FFF;
background-color: #E64340;
z-index: 110;
/* 动画部分 */
transition: all 0.4s ease;
}
.zan-toptips--show {
-webkit-transform: translateZ(0) translateY(0);
}

13
postcss.config.js Normal file
View File

@ -0,0 +1,13 @@
const postcssEasyImport = require('postcss-easy-import');
const precss = require('precss');
const postcssCalc = require('postcss-calc');
module.exports = {
plugins: [
postcssEasyImport({
extensions: ['wxss', 'css']
}),
precss(),
postcssCalc()
]
};