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

fix(Card): fix price font-family (#5194)

Browse Source
This commit is contained in:
Lindy 2019-12-06 11:34:14 +08:00 committed by neverland
parent 31d645959d
commit 04bfb76d63
4 changed files with 29 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/card/index.less
View File

@ -64,11 +64,16 @@
display: inline-block; display: inline-block;
color: @card-price-color; color: @card-price-color;
font-weight: @font-weight-bold; font-weight: @font-weight-bold;
font-size: @card-price-font-size;
}
&--integer { &__price-integer {
font-size: @card-price-integer-font-size; font-size: @card-price-integer-font-size;
font-family: @card-price-font-family; font-family: @card-price-font-family;
} }
&__price-decimal {
font-family: @card-price-font-family;
} }
&__origin-price { &__origin-price {

16
src/card/index.tsx
View File

@ -101,7 +101,11 @@ function Card(
} }
if (props.title) { if (props.title) {
return <div class={[bem('title'), 'van-multi-ellipsis--l2']}>{props.title}</div>; return (
<div class={[bem('title'), 'van-multi-ellipsis--l2']}>
{props.title}
</div>
);
} }
} }
@ -120,8 +124,8 @@ function Card(
return ( return (
<div> <div>
{props.currency} {props.currency}
<span class={bem('price', 'integer')}>{priceArr[0]}</span>. <span class={bem('price-integer')}>{priceArr[0]}</span>.
{priceArr[1]} <span class={bem('price-decimal')}>{priceArr[1]}</span>
</div> </div>
); );
} }
@ -149,7 +153,11 @@ function Card(
function Num() { function Num() {
if (showNum) { if (showNum) {
return <div class={bem('num')}>{slots.num ? slots.num() : `x${props.num}`}</div>; return (
<div class={bem('num')}>
{slots.num ? slots.num() : `x${props.num}`}
</div>
);
} }
} }

6
src/card/test/__snapshots__/demo.spec.js.snap
View File

@ -17,7 +17,7 @@ exports[`renders demo correctly 1`] = `
</div> </div>
<div class="van-card__bottom"> <div class="van-card__bottom">
<div class="van-card__price"> <div class="van-card__price">
<div>¥<span class="van-card__price van-card__price--integer">2</span>.00</div> <div>¥<span class="van-card__price-integer">2</span>.<span class="van-card__price-decimal">00</span></div>
</div> </div>
<div class="van-card__num">x2</div> <div class="van-card__num">x2</div>
</div> </div>
@ -41,7 +41,7 @@ exports[`renders demo correctly 1`] = `
</div> </div>
<div class="van-card__bottom"> <div class="van-card__bottom">
<div class="van-card__price"> <div class="van-card__price">
<div>¥<span class="van-card__price van-card__price--integer">2</span>.00</div> <div>¥<span class="van-card__price-integer">2</span>.<span class="van-card__price-decimal">00</span></div>
</div> </div>
<div class="van-card__origin-price">¥ 10.00</div> <div class="van-card__origin-price">¥ 10.00</div>
<div class="van-card__num">x2</div> <div class="van-card__num">x2</div>
@ -70,7 +70,7 @@ exports[`renders demo correctly 1`] = `
</div> </div>
<div class="van-card__bottom"> <div class="van-card__bottom">
<div class="van-card__price"> <div class="van-card__price">
<div>¥<span class="van-card__price van-card__price--integer">2</span>.00</div> <div>¥<span class="van-card__price-integer">2</span>.<span class="van-card__price-decimal">00</span></div>
</div> </div>
<div class="van-card__num">x2</div> <div class="van-card__num">x2</div>
</div> </div>

3
src/style/var.less
View File

@ -42,7 +42,7 @@
@font-size-md: 14px; @font-size-md: 14px;
@font-size-lg: 16px; @font-size-lg: 16px;
@font-weight-bold: 500; @font-weight-bold: 500;
@price-integer-font-family: Avenir-Heavy PingFang SC, Helvetica Neue, Arial, sans-serif; @price-integer-font-family: Avenir-Heavy, PingFang SC, Helvetica Neue, Arial, sans-serif;
// Animation // Animation
@animation-duration-base: .3s; @animation-duration-base: .3s;
@ -148,6 +148,7 @@
@card-origin-price-color: @gray-6; @card-origin-price-color: @gray-6;
@card-num-color: @gray-6; @card-num-color: @gray-6;
@card-origin-price-font-size: @font-size-xs; @card-origin-price-font-size: @font-size-xs;
@card-price-font-size: @font-size-sm;
@card-price-integer-font-size: @font-size-lg; @card-price-integer-font-size: @font-size-lg;
@card-price-font-family: @price-integer-font-family; @card-price-font-family: @price-integer-font-family;