feat(Loading): add @button-loading-icon-size less var

This commit is contained in:
chenjiahan 2021-03-17 10:02:24 +08:00 committed by neverland
parent e498057424
commit 465bf07095
7 changed files with 14 additions and 17 deletions

View File

@ -41,6 +41,7 @@ export default defineComponent({
hairline: Boolean,
disabled: Boolean,
iconPrefix: String,
loadingSize: String,
loadingText: String,
loadingType: String as PropType<LoadingType>,
tag: {
@ -59,10 +60,6 @@ export default defineComponent({
type: String as PropType<ButtonHTMLAttributes['type']>,
default: 'button',
},
loadingSize: {
type: String,
default: '20px',
},
iconPosition: {
type: String as PropType<'left' | 'right'>,
default: 'left',
@ -84,7 +81,6 @@ export default defineComponent({
class={bem('loading')}
size={props.loadingSize}
type={props.loadingType}
color="currentColor"
/>
);
};

View File

@ -181,3 +181,4 @@ How to use: [Custom Theme](#/en-US/theme).
| @button-plain-background-color | `@white` | - |
| @button-disabled-opacity | `@disabled-opacity` | - |
| @button-icon-size | `1.2em` | - |
| @button-loading-icon-size | `20px` | - |

View File

@ -208,3 +208,4 @@ app.use(Button);
| @button-plain-background-color | `@white` | - |
| @button-disabled-opacity | `@disabled-opacity` | - |
| @button-icon-size | `1.2em` | - |
| @button-loading-icon-size | `20px` | - |

View File

@ -110,6 +110,12 @@
&__loading {
color: inherit;
font-size: inherit;
.van-loading__spinner {
color: currentColor;
width: @button-loading-icon-size;
height: @button-loading-icon-size;
}
}
&--mini {

View File

@ -118,9 +118,7 @@ exports[`should render demo and match snapshot 1`] = `
>
<div class="van-button__content">
<div class="van-loading van-loading--circular van-button__loading">
<span class="van-loading__spinner van-loading__spinner--circular"
style="color: currentColor; width: 20px; height: 20px;"
>
<span class="van-loading__spinner van-loading__spinner--circular">
<svg class="van-loading__circular"
viewbox="25 25 50 50"
>
@ -140,9 +138,7 @@ exports[`should render demo and match snapshot 1`] = `
>
<div class="van-button__content">
<div class="van-loading van-loading--spinner van-button__loading">
<span class="van-loading__spinner van-loading__spinner--spinner"
style="color: currentColor; width: 20px; height: 20px;"
>
<span class="van-loading__spinner van-loading__spinner--spinner">
<i>
</i>
<i>
@ -176,9 +172,7 @@ exports[`should render demo and match snapshot 1`] = `
>
<div class="van-button__content">
<div class="van-loading van-loading--circular van-button__loading">
<span class="van-loading__spinner van-loading__spinner--circular"
style="color: currentColor; width: 20px; height: 20px;"
>
<span class="van-loading__spinner van-loading__spinner--circular">
<svg class="van-loading__circular"
viewbox="25 25 50 50"
>

View File

@ -159,6 +159,7 @@
@button-plain-background-color: @white;
@button-disabled-opacity: @disabled-opacity;
@button-icon-size: 1.2em;
@button-loading-icon-size: 20px;
// Calendar
@calendar-background-color: @white;

View File

@ -83,9 +83,7 @@ exports[`should render demo and match snapshot 1`] = `
>
<div class="van-button__content">
<div class="van-loading van-loading--circular van-button__loading">
<span class="van-loading__spinner van-loading__spinner--circular"
style="color: currentColor; width: 20px; height: 20px;"
>
<span class="van-loading__spinner van-loading__spinner--circular">
<svg class="van-loading__circular"
viewbox="25 25 50 50"
>