blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-05-22 22:49:15 +08:00
Code Issues Projects Releases Wiki Activity

[improvement] GoodsAction: update style (#3782)

Browse Source
This commit is contained in:
neverland 2019-07-09 11:15:33 +08:00 committed by GitHub
parent 6bc836beab
commit dac3bd3997
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 14 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/goods-action-icon/index.less
View File

@ -6,16 +6,12 @@
justify-content: center; justify-content: center;
min-width: @goods-action-icon-width; min-width: @goods-action-icon-width;
height: @goods-action-icon-height; height: @goods-action-icon-height;
color: @goods-action-icon-color; color: @goods-action-icon-text-color;
font-size: @goods-action-icon-font-size; font-size: @goods-action-icon-font-size;
line-height: 1; line-height: 1;
text-align: center; text-align: center;
background-color: @white; background-color: @white;
&:not(:first-child)::after {
border-left-width: 1px;
}
&:active { &:active {
background-color: @goods-action-icon-active-color; background-color: @goods-action-icon-active-color;
} }
@ -23,6 +19,7 @@
&__icon { &__icon {
width: 1em; width: 1em;
margin: 0 auto 5px; margin: 0 auto 5px;
color: @goods-action-icon-color;
font-size: @goods-action-icon-size; font-size: @goods-action-icon-size;
} }
} }

2
src/goods-action-icon/index.tsx
View File

@ -35,7 +35,7 @@ function GoodsActionIcon(
<div <div
role="button" role="button"
tabindex="0" tabindex="0"
class={[bem(), 'van-hairline']} class={bem()}
onClick={onClick} onClick={onClick}
{...inherit(ctx)} {...inherit(ctx)}
> >

10
src/goods-action/test/__snapshots__/demo.spec.js.snap
View File

@ -4,12 +4,12 @@ exports[`renders demo correctly 1`] = `
<div> <div>
<div> <div>
<div class="van-goods-action"> <div class="van-goods-action">
<div role="button" tabindex="0" class="van-goods-action-icon van-hairline"> <div role="button" tabindex="0" class="van-goods-action-icon">
<div class="van-icon van-icon-chat-o van-goods-action-icon__icon"> <div class="van-icon van-icon-chat-o van-goods-action-icon__icon">
<!----> <!---->
</div>客服 </div>客服
</div> </div>
<div role="button" tabindex="0" class="van-goods-action-icon van-hairline"> <div role="button" tabindex="0" class="van-goods-action-icon">
<div class="van-icon van-icon-cart-o van-goods-action-icon__icon"> <div class="van-icon van-icon-cart-o van-goods-action-icon__icon">
<!----> <!---->
</div>购物车 </div>购物车
@ -18,17 +18,17 @@ exports[`renders demo correctly 1`] = `
</div> </div>
<div> <div>
<div class="van-goods-action"> <div class="van-goods-action">
<div role="button" tabindex="0" class="van-goods-action-icon van-hairline"> <div role="button" tabindex="0" class="van-goods-action-icon">
<div class="van-icon van-icon-chat-o van-goods-action-icon__icon"> <div class="van-icon van-icon-chat-o van-goods-action-icon__icon">
<!----> <!---->
</div>客服 </div>客服
</div> </div>
<div role="button" tabindex="0" class="van-goods-action-icon van-hairline"> <div role="button" tabindex="0" class="van-goods-action-icon">
<div class="van-icon van-icon-cart-o van-goods-action-icon__icon"> <div class="van-icon van-icon-cart-o van-goods-action-icon__icon">
<div class="van-info">5</div> <div class="van-info">5</div>
</div>购物车 </div>购物车
</div> </div>
<div role="button" tabindex="0" class="van-goods-action-icon van-hairline"> <div role="button" tabindex="0" class="van-goods-action-icon">
<div class="van-icon van-icon-shop-o van-goods-action-icon__icon"> <div class="van-icon van-icon-shop-o van-goods-action-icon__icon">
<!----> <!---->
</div>店铺 </div>店铺

4
src/goods-action/test/__snapshots__/index.spec.js.snap
View File

@ -3,7 +3,7 @@
exports[`Button render default slot 1`] = `<button class="van-button van-button--default van-button--large van-button--square van-goods-action-button"><span class="van-button__text">Default Content</span></button>`; exports[`Button render default slot 1`] = `<button class="van-button van-button--default van-button--large van-button--square van-goods-action-button"><span class="van-button__text">Default Content</span></button>`;
exports[`Icon render default slot 1`] = ` exports[`Icon render default slot 1`] = `
<div role="button" tabindex="0" class="van-goods-action-icon van-hairline"> <div role="button" tabindex="0" class="van-goods-action-icon">
<div class="van-icon van-icon-undefined van-goods-action-icon__icon"> <div class="van-icon van-icon-undefined van-goods-action-icon__icon">
<!----> <!---->
</div>Default Content </div>Default Content
@ -11,7 +11,7 @@ exports[`Icon render default slot 1`] = `
`; `;
exports[`Icon render icon slot 1`] = ` exports[`Icon render icon slot 1`] = `
<div role="button" tabindex="0" class="van-goods-action-icon van-hairline"> <div role="button" tabindex="0" class="van-goods-action-icon">
<div class="van-goods-action-icon__icon">Custom Icon</div>Text <div class="van-goods-action-icon__icon">Custom Icon</div>Text
</div> </div>
`; `;

7
src/style/var.less
View File

@ -252,12 +252,13 @@
// GoodsAction // GoodsAction
@goods-action-background-color: @white; @goods-action-background-color: @white;
@goods-action-icon-width: 15%; @goods-action-icon-width: 48px;
@goods-action-icon-height: 50px; @goods-action-icon-height: 50px;
@goods-action-icon-color: @gray-darker; @goods-action-icon-color: @text-color;
@goods-action-icon-size: 20px; @goods-action-icon-size: 18px;
@goods-action-icon-font-size: 10px; @goods-action-icon-font-size: 10px;
@goods-action-icon-active-color: @active-color; @goods-action-icon-active-color: @active-color;
@goods-action-icon-text-color: @gray-darker;
// IndexAnchor // IndexAnchor
@index-anchor-padding: 0 15px; @index-anchor-padding: 0 15px;