diff --git a/README.md b/README.md index 842b86a6..040cfbeb 100644 --- a/README.md +++ b/README.md @@ -49,7 +49,6 @@ npm run dev * [Cell - 单元格](./packages/cell/README.md) * [Helper - 基础样式](./packages/helper/README.md) * [Icon - 图标](./packages/icon/README.md) -* [Label - 标签](./packages/label/README.md) * [Layout - 布局](./packages/row/README.md) * [Loadmore - 加载](./packages/loadmore/README.md) * [Noticebar - 通告栏](./packages/noticebar/README.md) @@ -62,6 +61,7 @@ npm run dev * [Tab - 标签](./packages/tab/README.md) * [Field - 输入框](./packages/field/README.md) * [Dialog - 弹出框](./packages/dialog/README.md) +* [Tag - 标签](./packages/tag/README.md) * [Toast - 轻提示](./packages/toast/README.md) * [Toptips - 顶部提示](./packages/toptips/README.md) diff --git a/example/app.json b/example/app.json index cc3f5836..1b30c602 100644 --- a/example/app.json +++ b/example/app.json @@ -10,7 +10,6 @@ "pages/field/index", "pages/helper/index", "pages/icon/index", - "pages/label/index", "pages/layout/index", "pages/loadmore/index", "pages/noticebar/index", @@ -20,6 +19,7 @@ "pages/steps/index", "pages/switch/index", "pages/tab/index", + "pages/tag/index", "pages/toptips/index", "pages/toast/index", "pages/select/index" diff --git a/example/pages/dashboard/config.js b/example/pages/dashboard/config.js index 921dc8fb..5bcbe843 100644 --- a/example/pages/dashboard/config.js +++ b/example/pages/dashboard/config.js @@ -24,10 +24,10 @@ export default { name: 'Icon 图标', path: '/pages/icon/index' }, { - name: 'Label 标签', - path: '/pages/label/index' + name: 'Tag 标记', + path: '/pages/tag/index' }, { - name: 'Layout 标签', + name: 'Layout 布局', path: '/pages/layout/index' }, { name: 'Loadmore 加载', diff --git a/example/pages/label/index.json b/example/pages/label/index.json deleted file mode 100644 index 8468bff2..00000000 --- a/example/pages/label/index.json +++ /dev/null @@ -1,3 +0,0 @@ -{ - "navigationBarTitleText": "Label 标签" -} diff --git a/example/pages/label/index.wxml b/example/pages/label/index.wxml deleted file mode 100644 index e83d3ea4..00000000 --- a/example/pages/label/index.wxml +++ /dev/null @@ -1,25 +0,0 @@ -<view class="container"> - - <view class="doc-title">LABEL</view> - - <view class="zan-panel"> - <view class="zan-cell zan-cell--last-child"> - <view class="zan-label">灰色</view> - <view class="zan-label zan-label--primary">红色</view> - <view class="zan-label zan-label--disabled">黑色</view> - </view> - </view> - <view class="zan-panel"> - <view class="zan-cell zan-cell--last-child"> - <view class="zan-label zan-label--primary zan-label--small">会员折扣</view> - <view class="zan-label zan-label--primary zan-label--small">返现</view> - </view> - </view> - - <view class="zan-panel"> - <view class="zan-cell zan-cell--last-child"> - <view class="zan-label zan-label--primary zan-label--small zan-label--plain">会员折扣</view> - <view class="zan-label zan-label--primary zan-label--small zan-label--plain">返现</view> - </view> - </view> -</view> diff --git a/example/pages/label/index.js b/example/pages/tag/index.js similarity index 100% rename from example/pages/label/index.js rename to example/pages/tag/index.js diff --git a/example/pages/tag/index.json b/example/pages/tag/index.json new file mode 100644 index 00000000..b1ca9e22 --- /dev/null +++ b/example/pages/tag/index.json @@ -0,0 +1,3 @@ +{ + "navigationBarTitleText": "Tag 标记" +} diff --git a/example/pages/tag/index.wxml b/example/pages/tag/index.wxml new file mode 100644 index 00000000..48a47f56 --- /dev/null +++ b/example/pages/tag/index.wxml @@ -0,0 +1,29 @@ +<view class="container"> + + <view class="doc-title">Tag</view> + + <view class="zan-panel"> + <view class="zan-cell zan-cell--last-child"> + <view class="zan-tag">灰色</view> + <view class="zan-tag zan-tag--danger">红色</view> + <view class="zan-tag zan-tag--disabled">黑色</view> + </view> + </view> + <view class="zan-panel"> + <view class="zan-cell zan-cell--last-child"> + <view class="zan-tag zan-tag--danger">会员折扣</view> + <view class="zan-tag zan-tag--warn">返现</view> + <view class="zan-tag zan-tag--primary">返现</view> + <view class="zan-tag zan-tag--primary zan-tag--disabled">黑色</view> + </view> + </view> + + <view class="zan-panel"> + <view class="zan-cell zan-cell--last-child"> + <view class="zan-tag zan-tag--danger zan-tag--plain">会员折扣</view> + <view class="zan-tag zan-tag--warn zan-tag--plain">返现</view> + <view class="zan-tag zan-tag--primary zan-tag--plain">返现</view> + <view class="zan-tag zan-tag--primary zan-tag--plain zan-tag--disabled">返现</view> + </view> + </view> +</view> diff --git a/example/pages/tag/index.wxss b/example/pages/tag/index.wxss new file mode 100644 index 00000000..9f37366d --- /dev/null +++ b/example/pages/tag/index.wxss @@ -0,0 +1,3 @@ +.zan-tag + .zan-tag { + margin-left: 10px; +} diff --git a/packages/index.pcss b/packages/index.pcss index b3909383..9e133feb 100644 --- a/packages/index.pcss +++ b/packages/index.pcss @@ -9,7 +9,6 @@ @import "field/index.pcss"; @import "helper/index.pcss"; @import "icon/index.pcss"; -@import "label/index.pcss"; @import "loadmore/index.pcss"; @import "noticebar/index.pcss"; @import "panel/index.pcss"; @@ -20,5 +19,6 @@ @import "steps/index.pcss"; @import "switch/index.pcss"; @import "tab/index.pcss"; +@import "tag/index.pcss"; @import "toast/index.pcss"; @import "toptips/index.pcss"; diff --git a/packages/label/index.pcss b/packages/label/index.pcss deleted file mode 100644 index 7c02728a..00000000 --- a/packages/label/index.pcss +++ /dev/null @@ -1,34 +0,0 @@ -.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; -} diff --git a/packages/label/README.md b/packages/tag/README.md similarity index 100% rename from packages/label/README.md rename to packages/tag/README.md diff --git a/packages/tag/index.pcss b/packages/tag/index.pcss new file mode 100644 index 00000000..5c4acaf3 --- /dev/null +++ b/packages/tag/index.pcss @@ -0,0 +1,54 @@ +.zan-tag { + display: inline-block; + box-sizing: border-box; + line-height: 16px; + padding: 0 5px; + border-radius: 2px; + font-size: 11px; + background: #c9c9c9; + border: 1rpx solid #e5e5e5; + color: #fff; +} + +/* 各种主题代码 */ +.zan-tag--primary { + color: #fff; + background-color: #4b0; + border: 1rpx solid #4b0; + + /* 空心形式 */ + &.zan-tag--plain { + color: #4b0; + background: #fff; + } +} +.zan-tag--danger { + color: #fff; + background: #f44; + border: 1rpx solid #f44; + + /* 空心形式 */ + &.zan-tag--plain { + color: #f44; + background: #fff; + } +} +.zan-tag--warn { + color: #fff; + background: #f85; + border: 1rpx solid #f85; + + /* 空心形式 */ + &.zan-tag--plain { + color: #f85; + background: #fff; + } +} + + +/* disabled tag */ +.zan-tag--disabled { + color: #cacaca !important; + background: #eee; + border: 1rpx solid #e5e5e5; +}