mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
feat(Uploader): add border-radius (#4709)
This commit is contained in:
parent
6b23b2c4b8
commit
bed2ca5063
@ -682,6 +682,7 @@
|
||||
@uploader-text-color: @gray-dark;
|
||||
@uploader-text-font-size: @font-size-sm;
|
||||
@uploader-upload-border-color: @gray-light;
|
||||
@uploader-upload-border-radius: 4px;
|
||||
@uploader-upload-background-color: @white;
|
||||
@uploader-delete-color: @white;
|
||||
@uploader-delete-background-color: rgba(0, 0, 0, .45);
|
||||
|
@ -226,6 +226,7 @@ export default createComponent({
|
||||
class={bem('preview-image')}
|
||||
width={this.previewSize}
|
||||
height={this.previewSize}
|
||||
radius={4}
|
||||
onClick={() => {
|
||||
this.onPreviewImage(item);
|
||||
}}
|
||||
|
@ -36,6 +36,7 @@
|
||||
margin: 0 @padding-xs @padding-xs 0;
|
||||
background-color: @uploader-upload-background-color;
|
||||
border: 1px dashed @uploader-upload-border-color;
|
||||
border-radius: @uploader-upload-border-radius;
|
||||
|
||||
&-icon {
|
||||
color: @uploader-icon-color;
|
||||
|
@ -14,7 +14,7 @@ exports[`renders demo correctly 1`] = `
|
||||
<div class="van-uploader">
|
||||
<div class="van-uploader__wrapper">
|
||||
<div class="van-uploader__preview">
|
||||
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;">
|
||||
<div class="van-image van-uploader__preview-image" style="overflow: hidden; border-radius: 4px;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;">
|
||||
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
|
||||
<!----></i></div>
|
||||
</div><i class="van-icon van-icon-delete van-uploader__preview-delete">
|
||||
|
@ -22,7 +22,7 @@ exports[`image-fit prop 1`] = `
|
||||
<div class="van-uploader">
|
||||
<div class="van-uploader__wrapper">
|
||||
<div class="van-uploader__preview">
|
||||
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: contain;">
|
||||
<div class="van-image van-uploader__preview-image" style="overflow: hidden; border-radius: 4px;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: contain;">
|
||||
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
|
||||
<!----></i></div>
|
||||
</div><i class="van-icon van-icon-delete van-uploader__preview-delete">
|
||||
@ -38,7 +38,7 @@ exports[`max-count prop 1`] = `
|
||||
<div class="van-uploader">
|
||||
<div class="van-uploader__wrapper">
|
||||
<div class="van-uploader__preview">
|
||||
<div class="van-image van-uploader__preview-image"><img src="data:image/test" class="van-image__img" style="object-fit: cover;">
|
||||
<div class="van-image van-uploader__preview-image" style="overflow: hidden; border-radius: 4px;"><img src="data:image/test" class="van-image__img" style="object-fit: cover;">
|
||||
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
|
||||
<!----></i></div>
|
||||
</div><i class="van-icon van-icon-delete van-uploader__preview-delete">
|
||||
@ -52,7 +52,7 @@ exports[`preview-size prop 1`] = `
|
||||
<div class="van-uploader">
|
||||
<div class="van-uploader__wrapper">
|
||||
<div class="van-uploader__preview" style="">
|
||||
<div class="van-image van-uploader__preview-image" style="width: 30px; height: 30px;"><img src="data:image/test" class="van-image__img" style="object-fit: cover;">
|
||||
<div class="van-image van-uploader__preview-image" style="width: 30px; height: 30px; overflow: hidden; border-radius: 4px;"><img src="data:image/test" class="van-image__img" style="object-fit: cover;">
|
||||
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
|
||||
<!----></i></div>
|
||||
</div><i class="van-icon van-icon-delete van-uploader__preview-delete">
|
||||
@ -68,7 +68,7 @@ exports[`render preview image 1`] = `
|
||||
<div class="van-uploader">
|
||||
<div class="van-uploader__wrapper">
|
||||
<div class="van-uploader__preview">
|
||||
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;">
|
||||
<div class="van-image van-uploader__preview-image" style="overflow: hidden; border-radius: 4px;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;">
|
||||
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
|
||||
<!----></i></div>
|
||||
</div><i class="van-icon van-icon-delete van-uploader__preview-delete">
|
||||
@ -89,7 +89,7 @@ exports[`render preview image 1`] = `
|
||||
<!----></i>
|
||||
</div>
|
||||
<div class="van-uploader__preview">
|
||||
<div class="van-image van-uploader__preview-image"><img src="data:image/test" class="van-image__img" style="object-fit: cover;">
|
||||
<div class="van-image van-uploader__preview-image" style="overflow: hidden; border-radius: 4px;"><img src="data:image/test" class="van-image__img" style="object-fit: cover;">
|
||||
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
|
||||
<!----></i></div>
|
||||
</div><i class="van-icon van-icon-delete van-uploader__preview-delete">
|
||||
|
Loading…
x
Reference in New Issue
Block a user