feat(Toast): add @toast-loading-icon-color var (#4782)

This commit is contained in:
neverland 2019-10-19 16:20:05 +08:00 committed by GitHub
parent 1e21ce3cc0
commit 878b330431
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 12 additions and 7 deletions

View File

@ -665,6 +665,7 @@
@toast-max-width: 70%;
@toast-font-size: @font-size-md;
@toast-text-color: @white;
@toast-loading-icon-color: @white;
@toast-line-height: 20px;
@toast-border-radius: @border-radius-md;
@toast-background-color: rgba(@text-color, .88);

View File

@ -21,8 +21,8 @@ Toast('Some messages');
```javascript
Toast.loading({
mask: true,
message: 'Loading...'
message: 'Loading...',
forbidClick: true
});
```

View File

@ -21,8 +21,8 @@ Toast('提示内容');
```js
Toast.loading({
mask: true,
message: '加载中...'
message: '加载中...',
forbidClick: true
});
```

View File

@ -95,7 +95,7 @@ export default createComponent({
}
if (type === 'loading') {
return <Loading class={bem('loading')} color="white" type={loadingType} />;
return <Loading class={bem('loading')} type={loadingType} />;
}
}

View File

@ -106,7 +106,7 @@ export default {
methods: {
showLoadingToast() {
this.$toast.loading({ mask: true, message: this.$t('loading') });
this.$toast.loading({ forbidClick: true, message: this.$t('loading') });
},
showSuccessToast() {

View File

@ -61,6 +61,10 @@
&__loading {
padding: @padding-base;
.van-loading__spinner {
color: @toast-loading-icon-color;
}
}
&__text {

View File

@ -29,7 +29,7 @@ exports[`show html toast 1`] = `
exports[`show loading toast 1`] = `
<div class="van-toast van-toast--middle" style="z-index: 2003;" name="van-fade">
<div class="van-loading van-loading--circular van-toast__loading"><span class="van-loading__spinner van-loading__spinner--circular" style="color: white;"><svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span></div>
<div class="van-loading van-loading--circular van-toast__loading"><span class="van-loading__spinner van-loading__spinner--circular"><svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span></div>
<div class="van-toast__text">Message</div>
</div>
`;