From 378009fefa711b0e112f2da4f7b109ab6f195e95 Mon Sep 17 00:00:00 2001 From: neverland Date: Wed, 29 Jul 2020 09:36:15 +0800 Subject: [PATCH] style(Image): update loading icon and error icon (#6890) --- src/card/test/__snapshots__/demo.spec.js.snap | 6 ++-- src/form/test/__snapshots__/demo.spec.js.snap | 2 +- src/grid/test/__snapshots__/demo.spec.js.snap | 6 ++-- src/image/README.md | 4 +-- src/image/README.zh-CN.md | 4 +-- src/image/index.js | 4 +-- src/image/index.less | 2 ++ .../test/__snapshots__/demo.spec.js.snap | 28 +++++++++---------- .../test/__snapshots__/index.spec.js.snap | 10 +++---- src/style/var.less | 6 ++-- .../test/__snapshots__/demo.spec.js.snap | 2 +- .../test/__snapshots__/demo.spec.js.snap | 14 +++++----- .../test/__snapshots__/index.spec.js.snap | 16 +++++------ 13 files changed, 54 insertions(+), 50 deletions(-) diff --git a/src/card/test/__snapshots__/demo.spec.js.snap b/src/card/test/__snapshots__/demo.spec.js.snap index ce4cac4ec..327abe557 100644 --- a/src/card/test/__snapshots__/demo.spec.js.snap +++ b/src/card/test/__snapshots__/demo.spec.js.snap @@ -6,7 +6,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -29,7 +29,7 @@ exports[`renders demo correctly 1`] = `
-
+
标签
@@ -54,7 +54,7 @@ exports[`renders demo correctly 1`] = `
-
+
diff --git a/src/form/test/__snapshots__/demo.spec.js.snap b/src/form/test/__snapshots__/demo.spec.js.snap index f9691d577..738f6d61d 100644 --- a/src/form/test/__snapshots__/demo.spec.js.snap +++ b/src/form/test/__snapshots__/demo.spec.js.snap @@ -175,7 +175,7 @@ exports[`renders demo correctly 1`] = `
-
+
diff --git a/src/grid/test/__snapshots__/demo.spec.js.snap b/src/grid/test/__snapshots__/demo.spec.js.snap index 4b9a61ac3..b917973ee 100644 --- a/src/grid/test/__snapshots__/demo.spec.js.snap +++ b/src/grid/test/__snapshots__/demo.spec.js.snap @@ -55,7 +55,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -63,7 +63,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -71,7 +71,7 @@ exports[`renders demo correctly 1`] = `
-
+
diff --git a/src/image/README.md b/src/image/README.md index 2b3bb1bf9..ea56dd794 100644 --- a/src/image/README.md +++ b/src/image/README.md @@ -75,8 +75,8 @@ Vue.use(Lazyload); | lazy-load | Whether to enable lazy load，should register [Lazyload](#/en-US/lazyload) component | _boolean_ | `false` | | show-error `v2.0.9` | Whether to show error placeholder | _boolean_ | `true` | | show-loading `v2.0.9` | Whether to show loading placeholder | _boolean_ | `true` | -| error-icon `v2.4.2` | Error icon | _string_ | `warning-o` | -| loading-icon `v2.4.2` | Loading icon | _string_ | `photo-o` | +| error-icon `v2.4.2` | Error icon | _string_ | `photo-fail` | +| loading-icon `v2.4.2` | Loading icon | _string_ | `photo` | ### fit optional value diff --git a/src/image/README.zh-CN.md b/src/image/README.zh-CN.md index adf57f026..da02c90ca 100644 --- a/src/image/README.zh-CN.md +++ b/src/image/README.zh-CN.md @@ -107,8 +107,8 @@ Vue.use(Lazyload); | lazy-load | 是否开启图片懒加载，须配合 [Lazyload](#/zh-CN/lazyload) 组件使用 | _boolean_ | `false` | | show-error `v2.0.9` | 是否展示图片加载失败提示 | _boolean_ | `true` | | show-loading `v2.0.9` | 是否展示图片加载中提示 | _boolean_ | `true` | -| error-icon `v2.4.2` | 失败时提示的[图标名称](#/zh-CN/icon)或图片链接 | _string_ | `warning-o` | -| loading-icon `v2.4.2` | 加载时提示的[图标名称](#/zh-CN/icon)或图片链接 | _string_ | `photo-o` | +| error-icon `v2.4.2` | 失败时提示的[图标名称](#/zh-CN/icon)或图片链接 | _string_ | `photo-fail` | +| loading-icon `v2.4.2` | 加载时提示的[图标名称](#/zh-CN/icon)或图片链接 | _string_ | `photo` | ### 图片填充模式  diff --git a/src/image/index.js b/src/image/index.js index 0b16ebb83..e5aa5be05 100644 --- a/src/image/index.js +++ b/src/image/index.js @@ -23,11 +23,11 @@ export default createComponent({ }, errorIcon: { type: String, - default: 'warning-o', + default: 'photo-fail', }, loadingIcon: { type: String, - default: 'photo-o', + default: 'photo', }, }, diff --git a/src/image/index.less b/src/image/index.less index 5f5af3f91..97155a230 100644 --- a/src/image/index.less +++ b/src/image/index.less @@ -36,10 +36,12 @@ } &__loading-icon { + color: @image-loading-icon-color; font-size: @image-loading-icon-size; } &__error-icon { + color: @image-error-icon-color; font-size: @image-error-icon-size; } } diff --git a/src/image/test/__snapshots__/demo.spec.js.snap b/src/image/test/__snapshots__/demo.spec.js.snap index 2c1671de0..949609521 100644 --- a/src/image/test/__snapshots__/demo.spec.js.snap +++ b/src/image/test/__snapshots__/demo.spec.js.snap @@ -5,7 +5,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -14,35 +14,35 @@ exports[`renders demo correctly 1`] = `
-
+
contain
-
+
cover
-
+
fill
-
+
none
-
+
scale-down
@@ -53,35 +53,35 @@ exports[`renders demo correctly 1`] = `
-
+
contain
-
+
cover
-
+
fill
-
+
none
-
+
scale-down
@@ -92,7 +92,7 @@ exports[`renders demo correctly 1`] = `
-
+
默认提示
@@ -111,14 +111,14 @@ exports[`renders demo correctly 1`] = `
-
+
默认提示
-
+
自定义提示
diff --git a/src/image/test/__snapshots__/index.spec.js.snap b/src/image/test/__snapshots__/index.spec.js.snap index 95dbee240..bf6b22e39 100644 --- a/src/image/test/__snapshots__/index.spec.js.snap +++ b/src/image/test/__snapshots__/index.spec.js.snap @@ -2,7 +2,7 @@ exports[`default slot 1`] = `
-
+
Custom Default
`; @@ -16,14 +16,14 @@ exports[`error-icon prop 1`] = ` exports[`lazy load 1`] = `
-
+
`; exports[`lazy-load error event 1`] = `
-
+
`; @@ -34,7 +34,7 @@ exports[`load event 1`] = `
-
+
`; @@ -48,7 +48,7 @@ exports[`loading-icon prop 1`] = ` exports[`radius prop 1`] = `
-
+
`; diff --git a/src/style/var.less b/src/style/var.less index 5989aea32..a5f71f417 100644 --- a/src/style/var.less +++ b/src/style/var.less @@ -424,8 +424,10 @@ @image-placeholder-text-color: @gray-6; @image-placeholder-font-size: @font-size-md; @image-placeholder-background-color: @background-color; -@image-loading-icon-size: 22px; -@image-error-icon-size: 22px; +@image-loading-icon-size: 32px; +@image-loading-icon-color: @gray-3; +@image-error-icon-size: 32px; +@image-error-icon-color: @gray-3; // ImagePreview @image-preview-index-text-color: @white; diff --git a/src/swipe-cell/test/__snapshots__/demo.spec.js.snap b/src/swipe-cell/test/__snapshots__/demo.spec.js.snap index 2e1757d61..2e9ca3965 100644 --- a/src/swipe-cell/test/__snapshots__/demo.spec.js.snap +++ b/src/swipe-cell/test/__snapshots__/demo.spec.js.snap @@ -27,7 +27,7 @@ exports[`renders demo correctly 1`] = `
-
+
diff --git a/src/uploader/test/__snapshots__/demo.spec.js.snap b/src/uploader/test/__snapshots__/demo.spec.js.snap index 9ada94279..6eb7af534 100644 --- a/src/uploader/test/__snapshots__/demo.spec.js.snap +++ b/src/uploader/test/__snapshots__/demo.spec.js.snap @@ -15,7 +15,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -23,7 +23,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -39,7 +39,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -49,7 +49,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -69,7 +69,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -85,7 +85,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -113,7 +113,7 @@ exports[`renders demo correctly 1`] = `
-
+
图片名称
diff --git a/src/uploader/test/__snapshots__/index.spec.js.snap b/src/uploader/test/__snapshots__/index.spec.js.snap index 978aeb5aa..172c43fc9 100644 --- a/src/uploader/test/__snapshots__/index.spec.js.snap +++ b/src/uploader/test/__snapshots__/index.spec.js.snap @@ -23,7 +23,7 @@ exports[`file message should be reactive 1`] = `
-
+
@@ -42,7 +42,7 @@ exports[`image-fit prop 1`] = `
-
+
@@ -59,7 +59,7 @@ exports[`max-count prop 1`] = `
-
+
@@ -74,7 +74,7 @@ exports[`preview-cover slot 1`] = `
-
+
https://img.yzcdn.cn/vant/cat.jpeg
@@ -83,7 +83,7 @@ exports[`preview-cover slot 1`] = `
-
+
https://img.yzcdn.cn/vant/cat.jpeg
@@ -101,7 +101,7 @@ exports[`preview-size prop 1`] = `
-
+
@@ -118,7 +118,7 @@ exports[`render preview image 1`] = `
-
+
@@ -142,7 +142,7 @@ exports[`render preview image 1`] = `
-
+