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

feat(Card): card组件样式变量化 (#2179)

Browse Source
This commit is contained in:
Lindy 2019-10-21 16:51:14 +08:00 committed by neverland
parent fbd142b245
commit 5f8983104d
2 changed files with 26 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
packages/card/index.less
View File

@ -4,10 +4,10 @@
.van-card {
position: relative;
box-sizing: border-box;
padding: 5px 15px;
font-size: 12px;
.theme(color, '@text-color');
.theme(background-color, '@background-color-light');
padding: @card-padding;
font-size: @card-font-size;
.theme(color, '@card-text-color');
.theme(background-color, '@card-background-color');
&__header {
display: flex;
@ -21,9 +21,9 @@
&__thumb {
position: relative;
flex: none;
width: 90px;
height: 90px;
margin-right: 10px;
width: @card-thumb-size;
height: @card-thumb-size;
margin-right: @padding-xs;
&:empty {
display: none;
@ -48,12 +48,12 @@
&__title {
font-weight: bold;
line-height: 16px;
line-height: @card-title-line-height;
}
&__desc {
line-height: 20px;
.theme(color, '@gray-darker');
line-height: @card-desc-line-height;
.theme(color, '@card-desc-color');
}
&__bottom {
@ -63,15 +63,15 @@
&__price {
display: inline-block;
font-weight: bold;
.theme(color, '@red');
.theme(color, '@card-price-color');
}
&__origin-price {
display: inline-block;
margin-left: 5px;
font-size: 10px;
font-size: @card-origin-price-font-size;
text-decoration: line-through;
.theme(color, '@gray-darker');
.theme(color, '@card-origin-price-color');
}
&__num {

13
packages/common/style/var.less
View File

@ -81,6 +81,19 @@
@button-border-radius: 2px;
@button-round-border-radius: 10em;
// Card
@card-padding: @padding-xs @padding-md;
@card-font-size: @font-size-sm;
@card-text-color: @text-color;
@card-background-color: @background-color-light;
@card-thumb-size: 90px;
@card-title-line-height: 16px;
@card-desc-color: @gray-darker;
@card-desc-line-height: 20px;
@card-price-color: @red;
@card-origin-price-color: @gray-darker;
@card-origin-price-font-size: @font-size-xs;
// Checkbox
@checkbox-size: 20px;
@checkbox-border-color: @gray-light;