Fixed closing modal

This commit is contained in:
Dennis Postma 2024-06-01 15:16:53 +02:00
parent 5c60fadaa3
commit 30537cc49e
2 changed files with 5 additions and 5 deletions

View File

@ -18,7 +18,7 @@
</div>
</div>
<Modal :isModalOpen="isModalOpen">
<Modal :isModalOpen="isModalOpen" @modal:close="isModalOpen = false">
<template #modal-header>
<h2 class="modal-title">Create your character</h2>
</template>

View File

@ -1,6 +1,6 @@
<template>
<Teleport to="body" v-if="isModalOpen">
<div class="modal-container" :style="{ top: y + 'px', left: x + 'px' }">
<Teleport to="body">
<div class="modal-container" :style="{ top: y + 'px', left: x + 'px' }" v-if="isModalOpenRef">
<div class="modal-header" @mousedown="startDrag">
<slot name="modal-header"/>
<button @click="close"><img src="/assets/icons/close-button-white.svg"></button>
@ -23,10 +23,10 @@ const properties = defineProps({
});
watch(() => properties.isModalOpen, (value) => {
isModalOpen.value = value;
isModalOpenRef.value = value;
});
const isModalOpen = ref(properties.isModalOpen);
const isModalOpenRef = ref(properties.isModalOpen);
const emit = defineEmits(["modal:close", "character:create"]);
function close () {