feat(Switch): remove inline style (#4914)

This commit is contained in:
neverland 2019-11-04 17:37:46 +08:00 committed by GitHub
parent 9ace3320b8
commit a19d3cc5c0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 9 additions and 10 deletions

View File

@ -606,6 +606,7 @@
@swipe-indicator-inactive-background-color: @border-color;
// Switch
@switch-size: 30px;
@switch-width: 2em;
@switch-height: 1em;
@switch-node-size: 1em;

View File

@ -6,6 +6,7 @@
box-sizing: content-box;
width: @switch-width;
height: @switch-height;
font-size: @switch-size;
background-color: @switch-background-color;
border: @switch-border;
border-radius: @switch-node-size;

View File

@ -14,6 +14,7 @@ export type SharedSwitchProps = {
};
export const switchProps = {
size: String,
value: null as any,
loading: Boolean,
disabled: Boolean,
@ -26,9 +27,5 @@ export const switchProps = {
inactiveValue: {
type: null as any,
default: false
},
size: {
type: String,
default: '30px'
}
};

View File

@ -3,17 +3,17 @@
exports[`renders demo correctly 1`] = `
<div>
<div>
<div role="switch" aria-checked="true" class="van-switch van-switch--on" style="font-size: 30px;">
<div role="switch" aria-checked="true" class="van-switch van-switch--on">
<div class="van-switch__node"></div>
</div>
</div>
<div>
<div role="switch" aria-checked="true" class="van-switch van-switch--on van-switch--disabled" style="font-size: 30px;">
<div role="switch" aria-checked="true" class="van-switch van-switch--on van-switch--disabled">
<div class="van-switch__node"></div>
</div>
</div>
<div>
<div role="switch" aria-checked="true" class="van-switch van-switch--on" style="font-size: 30px;">
<div role="switch" aria-checked="true" class="van-switch van-switch--on">
<div class="van-switch__node">
<div class="van-loading van-loading--circular van-switch__loading"><span class="van-loading__spinner van-loading__spinner--circular" style="color: rgb(25, 137, 250);"><svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span></div>
</div>
@ -25,12 +25,12 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
<div>
<div role="switch" aria-checked="true" class="van-switch van-switch--on" style="font-size: 30px; background-color: rgb(7, 193, 96);">
<div role="switch" aria-checked="true" class="van-switch van-switch--on" style="background-color: rgb(7, 193, 96);">
<div class="van-switch__node"></div>
</div>
</div>
<div>
<div role="switch" aria-checked="true" class="van-switch van-switch--on" style="font-size: 30px;">
<div role="switch" aria-checked="true" class="van-switch van-switch--on">
<div class="van-switch__node"></div>
</div>
</div>

View File

@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`inactive-color prop 1`] = `
<div role="switch" aria-checked="false" class="van-switch" style="font-size: 30px; background-color: black;">
<div role="switch" aria-checked="false" class="van-switch" style="background-color: black;">
<div class="van-switch__node"></div>
</div>
`;