feat(client): blur effect for modal

This commit is contained in:
syuilo
2020-07-12 18:14:59 +09:00
parent 426c2fa5d1
commit aae9bc4cf4
11 changed files with 64 additions and 76 deletions

View File

@ -1,7 +1,7 @@
<template>
<div class="mk-dialog" :class="{ iconOnly }">
<transition :name="$store.state.device.animation ? 'bg-fade' : ''" appear>
<div class="bg" ref="bg" @click="onBgClick" v-if="show"></div>
<div class="bg _modalBg" ref="bg" @click="onBgClick" v-if="show"></div>
</transition>
<transition :name="$store.state.device.animation ? 'dialog' : ''" appear @after-leave="() => { destroyDom(); }">
<div class="main" ref="main" v-if="show">
@ -245,16 +245,6 @@ export default Vue.extend({
width: initial;
}
> .bg {
display: block;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.7);
}
> .main {
display: block;
position: fixed;