Oliver/Phantom-Ink-Online
0
0
Fork 0
Code Issues Activity

Add teleport to Modals.

Browse source
This commit is contained in:
Oliver-Akins 2020-12-13 17:17:32 -07:00
parent f823e599b4
commit 42d0fe483e
1 changed files with 16 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

30
web/src/components/Modal.vue
View file

@ -1,18 +1,20 @@
<template>
<transition name="fade" @after-enter="content = true">
<div
v-if="show"
class="modal-container"
:class="closable ? 'clickable' : ''"
@click.self.stop="handleBackgroundClick"
>
<transition name="burst" @after-leave="$emit('closed')">
<div v-if="content" class="modal unclickable">
<slot />
</div>
</transition>
</div>
</transition>
<teleport to="body">
<transition name="fade" @after-enter="content = true">
<div
v-if="show"
class="modal-container"
:class="closable ? 'clickable' : ''"
@click.self.stop="handleBackgroundClick"
>
<transition name="burst" @after-leave="$emit('closed')">
<div v-if="content" class="modal unclickable">
<slot />
</div>
</transition>
</div>
</transition>
</teleport>
</template>
<script>