blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

style(ActionSheet): improve text size adjust (#6175)

Browse Source
This commit is contained in:
neverland 2020-04-29 20:12:30 +08:00 committed by GitHub
parent ba67c7bf23
commit 0a3cafcedb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 15 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/action-sheet/index.less
View File

@ -8,10 +8,10 @@
&__cancel { &__cancel {
display: block; display: block;
width: 100%; width: 100%;
height: @action-sheet-item-height;
padding: 0; padding: 0;
font-size: @action-sheet-item-font-size; font-size: @action-sheet-item-font-size;
line-height: @action-sheet-item-height; line-height: 20px;
text-align: center;
background-color: @action-sheet-item-background; background-color: @action-sheet-item-background;
border: none; border: none;
cursor: pointer; cursor: pointer;
@ -22,8 +22,6 @@
} }
&__item { &__item {
height: @action-sheet-item-height;
&--loading, &--loading,
&--disabled { &--disabled {
color: @action-sheet-item-disabled-text-color; color: @action-sheet-item-disabled-text-color;
@ -48,11 +46,10 @@
font-size: @action-sheet-subname-font-size; font-size: @action-sheet-subname-font-size;
} }
&__cancel::before { &__gap {
display: block; display: block;
height: @action-sheet-cancel-padding-top; height: @action-sheet-cancel-padding-top;
background-color: @action-sheet-cancel-padding-color; background-color: @action-sheet-cancel-padding-color;
content: ' ';
} }
&__header { &__header {

7
src/action-sheet/index.tsx
View File

@ -121,11 +121,12 @@ function ActionSheet(
function CancelText() { function CancelText() {
if (cancelText) { if (cancelText) {
return ( return [
<div class={bem('gap')} />,
<button type="button" class={bem('cancel')} onClick={onCancel}> <button type="button" class={bem('cancel')} onClick={onCancel}>
{cancelText} {cancelText}
</button> </button>,
); ];
} }
} }

10
src/action-sheet/test/__snapshots__/index.spec.js.snap
View File

@ -3,7 +3,9 @@
exports[`callback events 1`] = ` exports[`callback events 1`] = `
<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" name="van-popup-slide-bottom"><button type="button" class="van-action-sheet__item van-hairline--top"><span class="van-action-sheet__name">Option</span></button><button type="button" class="van-action-sheet__item van-action-sheet__item--disabled van-hairline--top"><span class="van-action-sheet__name">Option</span></button><button type="button" class="van-action-sheet__item van-action-sheet__item--loading van-hairline--top"> <div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" name="van-popup-slide-bottom"><button type="button" class="van-action-sheet__item van-hairline--top"><span class="van-action-sheet__name">Option</span></button><button type="button" class="van-action-sheet__item van-action-sheet__item--disabled van-hairline--top"><span class="van-action-sheet__name">Option</span></button><button type="button" class="van-action-sheet__item van-action-sheet__item--loading van-hairline--top">
<div class="van-loading van-loading--circular"><span class="van-loading__spinner van-loading__spinner--circular" style="width: 20px; height: 20px;"><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"><span class="van-loading__spinner van-loading__spinner--circular" style="width: 20px; height: 20px;"><svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span></div>
</button><button type="button" class="van-action-sheet__item van-hairline--top"><span class="van-action-sheet__name">Option</span><span class="van-action-sheet__subname">Subname</span></button><button type="button" class="van-action-sheet__cancel">Cancel</button></div> </button><button type="button" class="van-action-sheet__item van-hairline--top"><span class="van-action-sheet__name">Option</span><span class="van-action-sheet__subname">Subname</span></button>
<div class="van-action-sheet__gap"></div><button type="button" class="van-action-sheet__cancel">Cancel</button>
</div>
`; `;
exports[`close-icon prop 1`] = ` exports[`close-icon prop 1`] = `
@ -21,7 +23,11 @@ exports[`description prop 1`] = `
</div> </div>
`; `;
exports[`disable lazy-render 1`] = `<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" style="display: none;" name="van-popup-slide-bottom"><button type="button" class="van-action-sheet__item van-hairline--top"><span class="van-action-sheet__name">Option</span></button><button type="button" class="van-action-sheet__item van-hairline--top"><span class="van-action-sheet__name">Option</span></button><button type="button" class="van-action-sheet__cancel">Cancel</button></div>`; exports[`disable lazy-render 1`] = `
<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" style="display: none;" name="van-popup-slide-bottom"><button type="button" class="van-action-sheet__item van-hairline--top"><span class="van-action-sheet__name">Option</span></button><button type="button" class="van-action-sheet__item van-hairline--top"><span class="van-action-sheet__name">Option</span></button>
<div class="van-action-sheet__gap"></div><button type="button" class="van-action-sheet__cancel">Cancel</button>
</div>
`;
exports[`render title and default slot 1`] = ` exports[`render title and default slot 1`] = `
<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" name="van-popup-slide-bottom"> <div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" name="van-popup-slide-bottom">