style(CouponList): change default color

This commit is contained in:
chenjiahan 2022-02-20 20:17:05 +08:00
parent bef919c7f0
commit 85c5ad6718
7 changed files with 21 additions and 19 deletions

View File

@ -41,6 +41,9 @@
- ContactEdit: 提交按钮调整为 `primary` 类型
- ContactList: 提交按钮调整为 `primary` 类型
- ContactList: 重命名 `--van-contact-list-item-radio-icon-color``--van-contact-list-radio-color`
- CouponList: 重命名 `--van-coupon-corner-checkbox-icon-color``--van-coupon-checkbox-color`
- CouponList: 调整 `--van-coupon-amount-color` 变量的默认值为 `--van-primary-color`
- CouponList: 提交按钮调整为 `primary` 类型
- Field: 调整 `--van-field-label-color` 变量的默认值为 `--van-text-color`
- Switch: 移除 `--van-switch-border` 变量
- Switch: 调整 `--van-switch-size` 变量的默认值为 `26px`

View File

@ -121,7 +121,7 @@ export default defineComponent({
/>
<Button
plain
type="danger"
type="primary"
class={bem('exchange')}
text={props.exchangeButtonText || t('exchange')}
loading={props.exchangeButtonLoading}
@ -215,7 +215,7 @@ export default defineComponent({
v-show={props.showCloseButton}
round
block
type="danger"
type="primary"
class={bem('close')}
text={props.closeButtonText || t('close')}
onClick={() => emit('change', -1)}

View File

@ -181,7 +181,7 @@ The component provides the following CSS variables, which can be used to customi
| --van-coupon-disabled-text-color | _var(--van-text-color-2)_ | - |
| --van-coupon-description-padding | _var(--van-padding-xs) var(--van-padding-md)_ | - |
| --van-coupon-description-border-color | _var(--van-border-color)_ | - |
| --van-coupon-corner-checkbox-icon-color | _var(--van-danger-color)_ | - |
| --van-coupon-checkbox-color | _var(--van-danger-color)_ | - |
| --van-coupon-list-background | _var(--van-background)_ | - |
| --van-coupon-list-field-padding | _5px 0 5px var(--van-padding-md)_ | - |
| --van-coupon-list-exchange-button-height | _32px_ | - |

View File

@ -183,7 +183,7 @@ import type { CouponCellProps, CouponListProps } from 'vant';
| --van-coupon-disabled-text-color | _var(--van-text-color-2)_ | - |
| --van-coupon-description-padding | _var(--van-padding-xs) var(--van-padding-md)_ | - |
| --van-coupon-description-border-color | _var(--van-border-color)_ | - |
| --van-coupon-corner-checkbox-icon-color | _var(--van-danger-color)_ | - |
| --van-coupon-checkbox-color | _var(--van-danger-color)_ | - |
| --van-coupon-list-background | _var(--van-background)_ | - |
| --van-coupon-list-field-padding | _5px 0 5px var(--van-padding-md)_ | - |
| --van-coupon-list-exchange-button-height | _32px_ | - |

View File

@ -22,7 +22,7 @@ body {
padding-left: var(--van-padding-sm);
line-height: 34px;
background: var(--van-background);
border-radius: 17px;
border-radius: var(--van-radius-max);
&::placeholder {
color: var(--van-text-color-3);

View File

@ -15,7 +15,7 @@ exports[`should be the sames as the last snapshot when render coupon list 1`] =
</div>
</div>
<button type="button"
class="van-button van-button--danger van-button--normal van-button--plain van-button--disabled van-coupon-list__exchange"
class="van-button van-button--primary van-button--normal van-button--plain van-button--disabled van-coupon-list__exchange"
disabled
>
<div class="van-button__content">
@ -280,7 +280,7 @@ exports[`should be the sames as the last snapshot when render coupon list 1`] =
</div>
<div class="van-coupon-list__bottom">
<button type="button"
class="van-button van-button--danger van-button--normal van-button--block van-button--round van-coupon-list__close"
class="van-button van-button--primary van-button--normal van-button--block van-button--round van-coupon-list__close"
>
<div class="van-button__content">
<span class="van-button__text">
@ -307,7 +307,7 @@ exports[`should have two "van-coupon-list__empty" classes when render coupon lis
</div>
</div>
<button type="button"
class="van-button van-button--danger van-button--normal van-button--plain van-button--disabled van-coupon-list__exchange"
class="van-button van-button--primary van-button--normal van-button--plain van-button--disabled van-coupon-list__exchange"
disabled
>
<div class="van-button__content">
@ -392,7 +392,7 @@ exports[`should have two "van-coupon-list__empty" classes when render coupon lis
</div>
<div class="van-coupon-list__bottom">
<button type="button"
class="van-button van-button--danger van-button--normal van-button--block van-button--round van-coupon-list__close"
class="van-button van-button--primary van-button--normal van-button--block van-button--round van-coupon-list__close"
>
<div class="van-button__content">
<span class="van-button__text">
@ -419,7 +419,7 @@ exports[`should render list-footer slot correctly 1`] = `
</div>
</div>
<button type="button"
class="van-button van-button--danger van-button--normal van-button--plain van-button--disabled van-coupon-list__exchange"
class="van-button van-button--primary van-button--normal van-button--plain van-button--disabled van-coupon-list__exchange"
disabled
>
<div class="van-button__content">
@ -506,7 +506,7 @@ exports[`should render list-footer slot correctly 1`] = `
</div>
<div class="van-coupon-list__bottom">
<button type="button"
class="van-button van-button--danger van-button--normal van-button--block van-button--round van-coupon-list__close"
class="van-button van-button--primary van-button--normal van-button--block van-button--round van-coupon-list__close"
>
<div class="van-button__content">
<span class="van-button__text">
@ -533,7 +533,7 @@ exports[`should use custom src when using empty-image prop 1`] = `
</div>
</div>
<button type="button"
class="van-button van-button--danger van-button--normal van-button--plain van-button--disabled van-coupon-list__exchange"
class="van-button van-button--primary van-button--normal van-button--plain van-button--disabled van-coupon-list__exchange"
disabled
>
<div class="van-button__content">
@ -608,7 +608,7 @@ exports[`should use custom src when using empty-image prop 1`] = `
</div>
<div class="van-coupon-list__bottom">
<button type="button"
class="van-button van-button--danger van-button--normal van-button--block van-button--round van-coupon-list__close"
class="van-button van-button--primary van-button--normal van-button--block van-button--round van-coupon-list__close"
>
<div class="van-button__content">
<span class="van-button__text">

View File

@ -10,14 +10,14 @@ body {
--van-coupon-radius: var(--van-radius-lg);
--van-coupon-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
--van-coupon-head-width: 96px;
--van-coupon-amount-color: var(--van-danger-color);
--van-coupon-amount-color: var(--van-primary-color);
--van-coupon-amount-font-size: 30px;
--van-coupon-currency-font-size: 40%;
--van-coupon-name-font-size: var(--van-font-size-md);
--van-coupon-disabled-text-color: var(--van-text-color-2);
--van-coupon-description-padding: var(--van-padding-xs) var(--van-padding-md);
--van-coupon-description-border-color: var(--van-border-color);
--van-coupon-corner-checkbox-icon-color: var(--van-danger-color);
--van-coupon-checkbox-color: var(--van-primary-color);
}
.van-coupon {
@ -62,7 +62,6 @@ body {
.ellipsis();
span {
font-weight: normal;
font-size: var(--van-coupon-currency-font-size);
&:not(:empty) {
@ -85,7 +84,7 @@ body {
&__name {
margin-bottom: 10px;
font-weight: bold;
font-weight: var(--van-font-bold);
font-size: var(--van-coupon-name-font-size);
line-height: var(--van-line-height-md);
}
@ -101,8 +100,8 @@ body {
bottom: 0;
.van-checkbox__icon--checked .van-icon {
background-color: var(--van-coupon-corner-checkbox-icon-color);
border-color: var(--van-coupon-corner-checkbox-icon-color);
background-color: var(--van-coupon-checkbox-color);
border-color: var(--van-coupon-checkbox-color);
}
}