1
0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-26 03:16:35 +08:00

[improvement] CouponList: add less vars

This commit is contained in:
陈嘉涵 2019-05-15 10:26:03 +08:00
parent c8945625b1
commit dd3b3544a4
5 changed files with 38 additions and 17 deletions
packages
coupon-cell
coupon-list
goods-action-icon
goods-action
style

@ -2,6 +2,6 @@
.van-coupon-cell {
&--selected {
color: @text-color;
color: @coupon-cell-selected-text-color;
}
}

@ -3,15 +3,15 @@
.van-coupon-list {
position: relative;
height: 100%;
background-color: @background-color;
background-color: @coupon-list-background-color;
&__field {
padding: 7px 15px;
padding: @coupon-list-field-padding;
}
&__exchange {
height: 32px;
line-height: 30px;
height: @coupon-list-exchange-button-height;
line-height: @coupon-list-exchange-button-height - 2px;
}
&__list {
@ -34,14 +34,14 @@
p {
margin: 15px 0;
color: @gray-dark;
font-size: 14px;
line-height: 20px;
color: @coupon-list-empty-tip-color;
font-size: @coupon-list-empty-tip-font-size;
line-height: @coupon-list-empty-tip-line-height;
}
img {
width: 200px;
height: 200px;
width: @coupon-list-empty-image-size;
height: @coupon-list-empty-image-size;
}
}
}

@ -4,10 +4,10 @@
display: flex;
flex-direction: column;
justify-content: center;
min-width: 15%;
height: 50px;
color: @gray-darker;
font-size: 10px;
min-width: @goods-action-icon-width;
height: @goods-action-icon-height;
color: @goods-action-icon-color;
font-size: @goods-action-icon-font-size;
line-height: 1;
text-align: center;
background-color: @white;
@ -17,12 +17,12 @@
}
&:active {
background-color: @active-color;
background-color: @goods-action-icon-active-color;
}
&__icon {
width: 1em;
margin: 0 auto 5px;
font-size: 20px;
font-size: @goods-action-icon-size;
}
}

@ -6,7 +6,7 @@
bottom: 0;
left: 0;
display: flex;
background-color: @white;
background-color: @goods-action-background-color;
&--safe-area-inset-bottom {
padding-bottom: constant(safe-area-inset-bottom);

@ -184,6 +184,18 @@
@coupon-description-background-color: @background-color-light;
@coupon-description-border-color: @border-color;
// CouponCell
@coupon-cell-selected-text-color: @text-color;
// CouponList
@coupon-list-background-color: @background-color;
@coupon-list-field-padding: 7px 15px;
@coupon-list-exchange-button-height: 32px;
@coupon-list-empty-image-size: 200px;
@coupon-list-empty-tip-color: @gray-dark;
@coupon-list-empty-tip-font-size: 14px;
@coupon-list-empty-tip-line-height: 20px;
// Dialog
@dialog-width: 85%;
@dialog-font-size: 16px;
@ -220,6 +232,15 @@
@field-error-message-text-color: 12px;
@field-text-area-min-height: 60px;
// GoodsAction
@goods-action-background-color: @white;
@goods-action-icon-width: 15%;
@goods-action-icon-height: 50px;
@goods-action-icon-color: @gray-darker;
@goods-action-icon-size: 20px;
@goods-action-icon-font-size: 10px;
@goods-action-icon-active-color: @active-color;
// Info
@info-size: 16px;
@info-color: @white;