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:
parent
c8945625b1
commit
dd3b3544a4
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;
|
||||
|
Loading…
x
Reference in New Issue
Block a user