feat(二维码): 添加删除按钮并重构二维码元素结构
- 为二维码元素添加删除按钮,仅在选中时显示 - 重构二维码元素结构,将图片包裹在容器div中 - 调整透明度设置逻辑以匹配新结构 - 防止删除按钮触发拖拽事件
This commit is contained in:
30
css/qr.css
30
css/qr.css
@@ -142,6 +142,36 @@
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
/* 删除按钮 */
|
||||
.qr-delete-btn {
|
||||
position: absolute;
|
||||
top: -10px;
|
||||
right: -10px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background: #ff4444;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 50%;
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
cursor: pointer;
|
||||
display: none;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 100;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.qr-item.qr-selected .qr-delete-btn {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.qr-delete-btn:hover {
|
||||
background: #cc0000;
|
||||
}
|
||||
|
||||
/* ========== 二维码工具栏 - 与背景图工具栏保持一致 ========== */
|
||||
.qr-tools {
|
||||
display: none;
|
||||
|
||||
Reference in New Issue
Block a user