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

[Improvement] add active color for Badge、CouponList、ContactCard (#419)

Browse Source
This commit is contained in:
neverland 2017-12-12 20:05:36 +08:00 committed by GitHub
parent 1fd157e9f4
commit c455301129
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 22 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
packages/vant-css/src/badge.css
View File

@ -5,13 +5,18 @@
overflow: hidden; overflow: hidden;
font-size: 14px; font-size: 14px;
line-height: 1.4; line-height: 1.4;
user-select: none;
color: $gray-darker;
word-break: break-all;
box-sizing: border-box; box-sizing: border-box;
padding: 20px 12px 20px 9px; padding: 20px 12px 20px 9px;
color: $gray-darker;
background-color: $background-color; background-color: $background-color;
word-break: break-all;
border-left: 3px solid transparent; border-left: 3px solid transparent;
&:active {
background-color: $active-color;
}
&:not(:last-child)::after { &:not(:last-child)::after {
border-bottom-width: 1px; border-bottom-width: 1px;
} }
@ -24,11 +29,15 @@
font-weight: bold; font-weight: bold;
color: $text-color; color: $text-color;
border-color: $red; border-color: $red;
background-color: $white;
&::after { &::after {
border-right-width: 1px; border-right-width: 1px;
} }
&,
&:active {
background-color: $white;
}
} }
&__info { &__info {

4
packages/vant-css/src/contact-card.css
View File

@ -4,6 +4,10 @@
position: relative; position: relative;
background-color: $white; background-color: $white;
&:active {
background-color: $active-color;
}
&--add { &--add {
line-height: 40px; line-height: 40px;

6
packages/vant-css/src/coupon-list.css
View File

@ -229,5 +229,11 @@
background-image: linear-gradient(45deg, #a4a9b2, #b7bcc3); background-image: linear-gradient(45deg, #a4a9b2, #b7bcc3);
} }
} }
&:active {
.van-coupon-item__body {
background-color: $active-color;
}
}
} }
} }