teutat3s/elk
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

fix: dialog scroll lock (#124)

Browse source 
Co-authored-by: 三咲智子 Kevin Deng <sxzz@sxzz.moe>
This commit is contained in:
Ayaka Rizumu 2022-11-26 18:11:32 +08:00 committed by GitHub
parent b656c6fda2
commit 3d7d2ca405
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 12 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
components/modal/ModalDialog.vue
View file

@ -11,12 +11,13 @@ watchOnce(modelValue, () => {
<template> <template>
<div <div
class="fixed top-0 bottom-0 left-0 right-0 z-60" class="fixed top-0 bottom-0 left-0 right-0 z-60 overscroll-none overflow-y-scroll scrollbar-hide"
:class="modelValue ? '' : 'pointer-events-none'" :class="modelValue ? '' : 'pointer-events-none'"
> >
<div <div
class=" class="
bg-base bottom-0 left-0 right-0 top-0 absolute transition-opacity duration-500 ease-out bg-base bottom-0 left-0 right-0 top-0 absolute transition-opacity duration-500 ease-out
h-[calc(100%+0.5px)]
" "
:class="modelValue ? 'opacity-85' : 'opacity-0'" :class="modelValue ? 'opacity-85' : 'opacity-0'"
@click="modelValue = false" @click="modelValue = false"
@ -32,3 +33,13 @@ watchOnce(modelValue, () => {
</div> </div>
</div> </div>
</template> </template>
<style socped>
.scrollbar-hide {
scrollbar-width: none;
}
.scrollbar-hide::-webkit-scrollbar {
display: none;
}
</style>