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

feat(List): add @list-loading-icon-size less var (#8365)

Browse Source
This commit is contained in:
neverland 2021-03-17 10:10:58 +08:00 committed by GitHub
parent 465bf07095
commit 648a768bdd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 18 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/list/List.tsx
View File

@ -118,7 +118,9 @@ export default defineComponent({
{slots.loading ? ( {slots.loading ? (
slots.loading() slots.loading()
) : ( ) : (
<Loading size={16}>{props.loadingText || t('loading')}</Loading> <Loading class={bem('loading-icon')}>
{props.loadingText || t('loading')}
</Loading>
)} )}
</div> </div>
); );

3
src/list/README.md
View File

@ -204,7 +204,8 @@ How to use: [Custom Theme](#/en-US/theme).
| Name | Default Value | Description | | Name | Default Value | Description |
| ----------------------- | --------------- | ----------- | | ----------------------- | --------------- | ----------- |
| @list-icon-margin-right | `5px` | - | | @list-icon-margin-right | `@padding-base` | - |
| @list-text-color | `@gray-6` | - | | @list-text-color | `@gray-6` | - |
| @list-text-font-size | `@font-size-md` | - | | @list-text-font-size | `@font-size-md` | - |
| @list-text-line-height | `50px` | - | | @list-text-line-height | `50px` | - |
| @list-loading-icon-size | `16px` | - |

3
src/list/README.zh-CN.md
View File

@ -219,10 +219,11 @@ export default {
| 名称 | 默认值 | 描述 | | 名称 | 默认值 | 描述 |
| ----------------------- | --------------- | ---- | | ----------------------- | --------------- | ---- |
| @list-icon-margin-right | `5px` | - | | @list-icon-margin-right | `@padding-base` | - |
| @list-text-color | `@gray-6` | - | | @list-text-color | `@gray-6` | - |
| @list-text-font-size | `@font-size-md` | - | | @list-text-font-size | `@font-size-md` | - |
| @list-text-line-height | `50px` | - | | @list-text-line-height | `50px` | - |
| @list-loading-icon-size | `16px` | - |
## 常见问题 ## 常见问题

7
src/list/index.less
View File

@ -14,4 +14,11 @@
height: 0; height: 0;
pointer-events: none; pointer-events: none;
} }
&__loading-icon {
.van-loading__spinner {
width: @list-loading-icon-size;
height: @list-loading-icon-size;
}
}
} }

6
src/list/test/__snapshots__/demo.spec.ts.snap
View File

@ -46,10 +46,8 @@ exports[`should render demo and match snapshot 1`] = `
aria-busy="true" aria-busy="true"
> >
<div class="van-list__loading"> <div class="van-list__loading">
<div class="van-loading van-loading--circular"> <div class="van-loading van-loading--circular van-list__loading-icon">
<span class="van-loading__spinner van-loading__spinner--circular" <span class="van-loading__spinner van-loading__spinner--circular">
style="width: 16px; height: 16px;"
>
<svg class="van-loading__circular" <svg class="van-loading__circular"
viewbox="25 25 50 50" viewbox="25 25 50 50"
> >

3
src/style/var.less
View File

@ -469,10 +469,11 @@
@image-preview-close-icon-z-index: 1; @image-preview-close-icon-z-index: 1;
// List // List
@list-icon-margin-right: 5px; @list-icon-margin-right: @padding-base;
@list-text-color: @gray-6; @list-text-color: @gray-6;
@list-text-font-size: @font-size-md; @list-text-font-size: @font-size-md;
@list-text-line-height: 50px; @list-text-line-height: 50px;
@list-loading-icon-size: 16px;
// Loading // Loading
@loading-text-color: @gray-6; @loading-text-color: @gray-6;