bugfix: 图片预览和关闭按钮冲突
This commit is contained in:
@@ -8,9 +8,13 @@
|
|||||||
v-for="(image, index) in uploadedImages"
|
v-for="(image, index) in uploadedImages"
|
||||||
:key="index"
|
:key="index"
|
||||||
class="image-preview-item"
|
class="image-preview-item"
|
||||||
@click="previewImage(image.url)"
|
|
||||||
>
|
>
|
||||||
<img :src="image.url" :alt="image.name" class="preview-image" />
|
<img
|
||||||
|
:src="image.url"
|
||||||
|
:alt="image.name"
|
||||||
|
class="preview-image"
|
||||||
|
@click="previewImage(image.url)"
|
||||||
|
/>
|
||||||
<div class="image-remove-btn" @click="removeImage(index)">
|
<div class="image-remove-btn" @click="removeImage(index)">
|
||||||
<SvgIcon name="delete" size="16" />
|
<SvgIcon name="delete" size="16" />
|
||||||
</div>
|
</div>
|
||||||
@@ -918,17 +922,16 @@
|
|||||||
height: 1.6rem;
|
height: 1.6rem;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
display: flex;
|
// display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
font-size: 1.2rem;
|
font-size: 1.2rem;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
display: none;
|
display: none;
|
||||||
transition: opacity 0.2s ease;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover .image-remove-btn {
|
&:hover .image-remove-btn {
|
||||||
display: block;
|
display: flex;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user