usbharu
/
misskey
mirror of https://github.com/misskey-dev/misskey.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update modal.vue

This commit is contained in:
syuilo 2020-09-05 22:06:33 +09:00
parent 32c4b079ba
commit a965fac82a
1 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/client/components/modal.vue
View File

@ -1,19 +1,21 @@
<template> <template>
<div class="mk-modal" v-hotkey.global="keymap" :style="{ pointerEvents: showing ? 'auto' : 'none' }"> <div class="mk-modal" v-hotkey.global="keymap" :style="{ pointerEvents: showing ? 'auto' : 'none' }">
<transition :name="$store.state.device.animation ? 'bg-fade' : ''" appear> <transition :name="$store.state.device.animation ? 'bg-fade' : ''" appear>
<div class="bg _modalBg" ref="bg" v-if="showing" @click="$emit('click')"></div> <div class="bg _modalBg" v-if="showing" @click="$emit('click')"></div>
</transition> </transition>
<div class="content" @click.self="$emit('click')">
<transition :name="$store.state.device.animation ? 'modal' : ''" appear @after-leave="$emit('closed')"> <transition :name="$store.state.device.animation ? 'modal' : ''" appear @after-leave="$emit('closed')">
<div class="content" ref="content" v-if="showing" @click.self="$emit('click')"><slot></slot></div> <slot v-if="showing"></slot>
</transition> </transition>
</div> </div>
</div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent } from 'vue'; import { defineComponent } from 'vue';
export default defineComponent({ export default defineComponent({
emits: ['click', 'esc'], emits: ['click', 'esc', 'closed'],
props: { props: {
showing: { showing: {
type: Boolean, type: Boolean,