fix. 템플릿 수정

layers/components/blocks/modal/Layer.vue

@@ -0,0 +1,50 @@
+<script setup lang="ts">
+interface props {
+  isShowDimmed?: boolean
+  isOutsideClose?: boolean
+  modalName?: string
+  areaClass?: string
+  closeClass?: string
+}
+
+const props = withDefaults(defineProps<props>(), {
+  isShowDimmed: false,
+  isOutsideClose: false,
+})
+
+const isOpen = defineModel<boolean>('isOpen', { default: false })
+
+const handleCloseModal = () => {
+  isOpen.value = false
+}
+
+const handleOutsideClick = () => {
+  if (props.isOutsideClose) {
+    handleCloseModal()
+  }
+}
+</script>
+
+<template>
+  <Transition name="fade">
+    <div
+      v-if="isOpen"
+      :class="['modal-wrap', { dimmed: props.isShowDimmed }, props.modalName]"
+      @click="handleOutsideClick"
+    >
+      <div :class="['modal-area', props.areaClass]" @click.stop>
+        <div class="modal-content">
+          <slot></slot>
+        </div>
+        <button
+          type="button"
+          :class="['modal-close', props.closeClass]"
+          @click="handleCloseModal"
+        >
+          <span class="sr-only">close</span>
+          <AtomsIconsCloseLine size="24" color="#333333" />
+        </button>
+      </div>
+    </div>
+  </Transition>
+</template>