vant-weapp/packages/tag/index.pcss
Yao ce5559a57e
[improvement] 部分组件边框实现修改 (#87)
* 使用超细边框

* 部分组件切换为 hairline

* 文档 边框替换
2017-12-23 14:25:41 +08:00

84 lines
1.4 KiB
Plaintext

@import '../common/_var';
@import "../common/_mixins";
.zan-tag {
display: inline-block;
position: relative;
box-sizing: border-box;
line-height: 16px;
padding: 0 5px;
border-radius: 2px;
font-size: 11px;
background: $gray;
text-align: center;
color: $white;
&::after {
@mixin hairline;
border-width: 1px;
border-radius: 4px;
}
}
.zan-tag--plain {
color: $gray;
background: $white;
}
/* 各种主题代码 */
.zan-tag--primary {
color: $button-primary-color;
background-color: $button-primary-background-color;
&::after {
border-color: $button-primary-background-color;
}
/* 空心形式 */
&.zan-tag--plain {
color: $button-primary-background-color;
background: $white;
}
}
.zan-tag--danger {
color: $button-danger-color;
background: $button-danger-background-color;
&::after {
border-color: $button-danger-background-color;
}
/* 空心形式 */
&.zan-tag--plain {
color: $button-danger-background-color;
background: $button-danger-color;
}
}
.zan-tag--warn {
color: $white;
background: #f85;
&::after {
border-color: #f85;
}
/* 空心形式 */
&.zan-tag--plain {
color: #f85;
background: $white;
}
}
/* disabled tag */
.zan-tag--disabled {
color: $button-disabled-color !important;
background: $button-disabled-background-color;
&::after {
border-color: $button-disabled-border-color;
}
}