Mizah/Sharkey
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(client): blur effect for modal

Browse source
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
Download patch file Download diff file Expand all files Collapse all files

8
src/client/components/popup.vue
View file

@ -1,7 +1,7 @@
<template>
<div class="mk-popup" v-hotkey.global="keymap">
<transition :name="$store.state.device.animation ? 'bg-fade' : ''" appear>
<div class="bg" ref="bg" @click="close()" v-if="show"></div>
<div class="bg _modalBg" ref="bg" @click="close()" v-if="show"></div>
</transition>
<transition :name="$store.state.device.animation ? 'popup' : ''" appear @after-leave="() => { $emit('closed'); destroyDom(); }">
<div class="content" :class="{ fixed }" ref="content" v-if="show" :style="{ width: width ? width + 'px' : 'auto' }"><slot></slot></div>
@ -128,13 +128,7 @@ export default Vue.extend({
.mk-popup {
> .bg {
position: fixed;
top: 0;
left: 0;
z-index: 10000;
width: 100%;
height: 100%;
background: var(--modalBg)
}
> .content {