Fun/TeyvatGuide
1
0
Fork 0
mirror of https://github.com/BTMuli/TeyvatGuide.git synced 2026-04-05 07:15:06 +08:00
Code Issues Packages Projects Releases Wiki Activity

🚸 当允许点击外部关闭时增加关闭按钮

Browse Source 
close #201
This commit is contained in:
BTMuli
2026-01-03 00:58:11 +08:00
parent 1f05b0d97c
commit b42b13f79a
2 changed files with 29 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/func/dialog.vue
View File

@@ -29,6 +29,9 @@
{{ data.confirmLabel }}
</button>
</div>
<div v-if="!!data.otcancel" class="dialog-close-btn" title="关闭" @click="handleOuter">
x
</div>
</div>
</transition>
</div>
@@ -238,6 +241,7 @@ defineExpose({ displayInputBox, displayCheckBox });
}
.dialog-box {
position: relative;
display: flex;
width: 520px;
height: 240px;
@@ -312,6 +316,26 @@ defineExpose({ displayInputBox, displayCheckBox });
font-size: 20px;
}
.dialog-close-btn {
position: absolute;
right: 50%;
bottom: -40px;
display: flex;
width: 24px;
height: 24px;
align-items: center;
justify-content: center;
border-radius: 50%;
background: var(--dialog-title);
color: var(--tgc-yellow-3);
cursor: pointer;
font-family: var(--font-title);
font-size: 16px;
line-height: 24px;
transform: translateX(50%);
user-select: none;
}
.no-btn {
border: 1px solid var(--tgc-yellow-1);
}