feat:【ele】【mall】diy-editor 的 hot-zone-edit-dialog 使用 tailwindcss 简化 style

This commit is contained in:
YunaiV
2025-11-03 09:26:40 +08:00
parent b6920f332a
commit e5ba8ca4f1

View File

@@ -193,7 +193,7 @@ const handleAppLinkChange = (appLink: AppLink) => {
<div <div
v-for="(item, hotZoneIndex) in formData" v-for="(item, hotZoneIndex) in formData"
:key="hotZoneIndex" :key="hotZoneIndex"
class="hot-zone absolute z-10 flex cursor-move items-center justify-center border text-base opacity-80" class="group absolute z-10 flex cursor-move items-center justify-center border text-base opacity-80"
:style="{ :style="{
width: `${item.width}px`, width: `${item.width}px`,
height: `${item.height}px`, height: `${item.height}px`,
@@ -211,7 +211,7 @@ const handleAppLinkChange = (appLink: AppLink) => {
</span> </span>
<IconifyIcon <IconifyIcon
icon="ep:close" icon="ep:close"
class="delete absolute right-0 top-0 hidden cursor-pointer rounded-bl-[80%] p-[2px_2px_6px_6px] text-right text-white" class="absolute right-0 top-0 hidden cursor-pointer rounded-bl-[80%] p-[2px_2px_6px_6px] text-right text-white group-hover:block"
:style="{ backgroundColor: 'var(--el-color-primary)' }" :style="{ backgroundColor: 'var(--el-color-primary)' }"
:size="14" :size="14"
@click="handleRemove(item)" @click="handleRemove(item)"
@@ -240,11 +240,3 @@ const handleAppLinkChange = (appLink: AppLink) => {
@app-link-change="handleAppLinkChange" @app-link-change="handleAppLinkChange"
/> />
</template> </template>
<style scoped lang="scss">
.hot-zone:hover {
.delete {
display: block;
}
}
</style>