blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-25 02:41:46 +08:00
Code Issues Projects Releases Wiki Activity

[improvement] Card: add less vars ()

Browse Source
This commit is contained in:
neverland 2019-04-17 16:31:24 +08:00 committed by GitHub
parent ce4e0cc3e9
commit b5f7e55716
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 29 additions and 16 deletions
packages
card
index.less
style
var.less

32
packages/card/index.less

@ -3,11 +3,11 @@
.van-card {
position: relative;
color: @text-color;
font-size: 12px;
padding: 5px 15px;
color: @card-text-color;
padding: @card-padding;
font-size: @card-font-size;
box-sizing: border-box;
background-color: @background-color-light;
background-color: @card-background-color;
&:not(:first-child) {
margin-top: 10px;
@ -19,8 +19,8 @@
&__thumb {
position: relative;
width: 90px;
height: 90px;
width: @card-thumb-size;
height: @card-thumb-size;
margin-right: 10px;
flex: none;
align-items: center;
@ -37,7 +37,7 @@
position: relative;
display: flex;
flex: 1;
height: 90px;
height: @card-thumb-size;
flex-direction: column;
min-width: 0; /* hack for flex box ellipsis */
@ -52,17 +52,17 @@
}
&__title {
line-height: 16px;
line-height: @card-title-line-height;
max-height: 32px;
font-weight: bold;
font-weight: 500;
.multi-ellipsis(2);
}
&__desc {
color: @gray-darker;
max-height: 20px;
line-height: 20px;
color: @card-desc-color;
max-height: @card-desc-line-height;
line-height: @card-desc-line-height;
}
&__bottom {
@ -71,15 +71,15 @@
&__price {
display: inline-block;
color: @red;
font-weight: bold;
color: @card-price-color;
font-weight: 500;
}
&__origin-price {
display: inline-block;
margin-left: 5px;
font-size: 10px;
color: @gray-darker;
color: @card-origin-price-color;
font-size: @card-origin-price-font-size;
text-decoration: line-through;
}

13
packages/style/var.less

@ -87,6 +87,19 @@
@button-plain-background-color: @white;
@button-disabled-opacity: .5;
// Card
@card-padding: 5px 15px;
@card-font-size: 12px;
@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: 10px;
// Cell
@cell-font-size: 14px;
@cell-line-height: 24px;