fix. 이미지 DB와 동일하게 수정

layers/components/atoms/modal/Alert.vue

@@ -1,65 +0,0 @@
-<script setup lang="ts">
-interface props {
-  isShowDimmed?: boolean
-  contentText?: string
-  confirmButtonText?: string
-  isOutsideClose?: boolean
-  modalName?: string
-}
-
-const props = withDefaults(defineProps<props>(), {
-  isShowDimmed: false,
-  isOutsideClose: false,
-})
-
-const emit = defineEmits(['confirmButtonEvent'])
-
-const isOpen = defineModel<boolean>('isOpen', { default: false })
-
-const setButtonEvent = (event?: () => void | void) => {
-  if (typeof event === 'function') {
-    return event()
-  }
-  isOpen.value = false
-}
-
-const handleOutsideClick = () => {
-  if (props.isOutsideClose) {
-    isOpen.value = false
-  }
-}
-</script>
-
-<template>
-  <Transition name="fade">
-    <div
-      v-if="isOpen"
-      :class="['modal-wrap', { dimmed: props.isShowDimmed }, props.modalName]"
-      @click="handleOutsideClick"
-    >
-      <div class="modal-area" @click.stop>
-        <div class="modal-content">
-          <p
-            v-if="props.contentText"
-            v-dompurify-html="props.contentText"
-            class="content-text"
-          ></p>
-          <slot></slot>
-          <div class="content-btns">
-            <AtomsButtonVariant
-              @click="setButtonEvent(() => emit('confirmButtonEvent'))"
-            >
-              {{ props.confirmButtonText || '확인' }}
-            </AtomsButtonVariant>
-          </div>
-        </div>
-      </div>
-    </div>
-  </Transition>
-</template>
-
-<style scoped>
-.modal-area {
-  @apply max-w-[312px] p-6 bg-white rounded-[20px];
-}
-</style>

layers/components/atoms/modal/Confirm.vue

@@ -1,72 +0,0 @@
-<script setup lang="ts">
-interface props {
-  isShowDimmed?: boolean
-  contentText?: string
-  confirmButtonText?: string
-  cancelButtonText?: string
-  isOutsideClose?: boolean
-  modalName?: string
-}
-
-const props = withDefaults(defineProps<props>(), {
-  isShowDimmed: false,
-  isOutsideClose: false,
-})
-
-const emit = defineEmits(['cancelButtonEvent', 'confirmButtonEvent'])
-
-const isOpen = defineModel<boolean>('isOpen', { default: false })
-
-const setButtonEvent = (event?: () => void) => {
-  if (event) {
-    event()
-  }
-  isOpen.value = false
-}
-
-const handleOutsideClick = () => {
-  if (props.isOutsideClose) {
-    isOpen.value = false
-  }
-}
-</script>
-
-<template>
-  <Transition name="fade">
-    <div
-      v-if="isOpen"
-      :class="['modal-wrap', { dimmed: props.isShowDimmed }, props.modalName]"
-      @click="handleOutsideClick"
-    >
-      <div class="modal-area" @click.stop>
-        <div class="modal-content">
-          <p
-            v-if="props.contentText"
-            v-dompurify-html="props.contentText"
-            class="content-text"
-          ></p>
-          <slot></slot>
-          <div class="content-btns">
-            <AtomsButtonVariant
-              variant="outlined"
-              @click="setButtonEvent(() => emit('cancelButtonEvent'))"
-            >
-              {{ props.cancelButtonText || '취소' }}
-            </AtomsButtonVariant>
-            <AtomsButtonVariant
-              @click="setButtonEvent(() => emit('confirmButtonEvent'))"
-            >
-              {{ props.confirmButtonText || '확인' }}
-            </AtomsButtonVariant>
-          </div>
-        </div>
-      </div>
-    </div>
-  </Transition>
-</template>
-
-<style scoped>
-.modal-area {
-  @apply max-w-[312px] p-6 bg-white rounded-[20px];
-}
-</style>

layers/components/atoms/modal/Layer.vue

@@ -1,50 +0,0 @@
-<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>

layers/components/atoms/modal/YouTube.vue

@@ -1,88 +0,0 @@
-<script setup lang="ts">
-import { getYouTubeEmbedUrl } from '@/layers/utils/youtubeUtil'
-
-interface Props {
-  youtubeUrl: string
-  isOutsideClose?: boolean
-  modalName?: string
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  youtubeUrl: '',
-  isOutsideClose: false,
-})
-
-const emit = defineEmits(['closeButtonEvent'])
-
-const isOpen = defineModel<boolean>('isOpen', { default: false })
-
-const embedUrl = computed(() => {
-  return getYouTubeEmbedUrl(props.youtubeUrl)
-})
-
-const handleCloseModal = () => {
-  isOpen.value = false
-  emit('closeButtonEvent')
-}
-
-const handleKeydown = (event: KeyboardEvent) => {
-  if (event.key === 'Escape' && isOpen.value) {
-    handleCloseModal()
-  }
-}
-
-const handleOutsideClick = () => {
-  if (props.isOutsideClose) {
-    handleCloseModal()
-  }
-}
-
-// 키보드 이벤트 리스너 등록/해제
-onMounted(() => {
-  document.addEventListener('keydown', handleKeydown)
-})
-
-onUnmounted(() => {
-  document.removeEventListener('keydown', handleKeydown)
-})
-</script>
-
-<template>
-  <Transition name="fade">
-    <div
-      v-if="isOpen"
-      class="fixed inset-0 flex items-center justify-center bg-black bg-opacity-75 z-[800]"
-      :class="props.modalName"
-      @click="handleOutsideClick"
-    >
-      <div
-        class="relative mx-4 my-4"
-        style="
-          width: min(896px, 90vw, calc((90vh - 2rem) * 16 / 9));
-          aspect-ratio: 16/9;
-        "
-        @click.stop
-      >
-        <!-- 헤더 -->
-        <div class="flex justify-end mb-3 md:mb-4">
-          <button type="button" @click="handleCloseModal">
-            <AtomsIconsCloseLine />
-          </button>
-        </div>
-
-        <!-- 유튜브 영상 컨테이너 -->
-        <div class="relative w-full h-full">
-          <iframe
-            v-if="embedUrl"
-            :src="embedUrl"
-            class="absolute top-0 left-0 w-full h-full"
-            frameborder="0"
-            allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
-            allowfullscreen
-            title="YouTube video player"
-          />
-        </div>
-      </div>
-    </div>
-  </Transition>
-</template>

layers/components/blocks/modal/Client.vue

@@ -1,68 +0,0 @@
-<script setup lang="ts">
-const { isShowCheckLauncher, isShowDownloadLauncher, downloadLauncher } =
-  useCheckGameStart()
-</script>
-
-<template>
-  <AtomsModalLayer
-    v-model:is-open="isShowCheckLauncher"
-    :is-show-dimmed="true"
-    :is-outside-close="false"
-    :modal-name="'launcher'"
-    area-class="max-w-[480px] pt-[56px] px-[24px] pb-[24px] rounded-[8px]"
-    close-class="absolute top-[16px] right-[24px]"
-  >
-    <span class="ico-loading"></span>
-    <!-- [TODO] i18n 적용 -->
-    <!-- <p class="text-check">{{ tm('Common_Message_Check_Client').txt }}</p> -->
-    <p class="text-check">pc 클라이언트 실행 중...</p>
-    <Transition name="fade">
-      <div v-if="isShowDownloadLauncher" class="client-area">
-        <!-- <p
-              v-dompurify-html="tm('Common_Message_Download_Client').txt"
-              class="text-info"
-            ></p>
-            <button type="button" class="btn-download" @click="downloadLauncher">
-              {{ tm('Common_Message_Install').txt }}
-            </button>
-            <p
-              v-dompurify-html="tm('Common_Message_Download_Close').txt"
-              class="text-tip"
-            ></p> -->
-        <p class="text-info">
-          PC 클라이언트가 실행되지 않나요?
-          <br />
-          다운로드 전이라면 다운로드 후 진행해주세요
-        </p>
-        <AtomsButtonVariant class="max-w-[300px]" @click="downloadLauncher">
-          다운로드
-        </AtomsButtonVariant>
-        <p
-          v-dompurify-html="
-            '*PC 클라이언트가 정상 실행되었다면 팝업을 닫아 주세요.'
-          "
-          class="text-tip"
-        ></p>
-      </div>
-    </Transition>
-  </AtomsModalLayer>
-</template>
-
-<style scoped>
-.ico-loading {
-  @apply block mx-auto mb-4 w-[80px] h-[80px] bg-[url('/images/common/stove_loading_light.png')] bg-contain bg-center bg-no-repeat;
-}
-.text-check {
-  @apply mb-6 text-center text-[20px] font-bold leading-[30px] tracking-[-0.6px] text-[#333333];
-}
-
-.client-area {
-  @apply pt-4 border-t border-[rgba(0,0,0,0.08)] text-center;
-}
-.text-info {
-  @apply mb-3 text-[14px] font-medium leading-[24px] tracking-[-0.42px] text-[#333333];
-}
-.text-tip {
-  @apply mt-4 text-[14px] leading-[20px] tracking-[-0.42px] text-[#999999];
-}
-</style>

layers/public/images/common/ic-v2-logo-kakaotalk-fill.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M12 3C6.2008 3 1.5 6.71613 1.5 11.3008C1.5 14.2848 3.4918 16.8999 6.48115 18.363C6.26156 19.1831 5.686 21.3336 5.57041 21.7936C5.42833 22.3647 5.77994 22.357 6.01014 22.2032C6.19062 22.083 8.88744 20.2499 10.051 19.4586C10.6824 19.5521 11.3338 19.6019 12 19.6019C17.799 19.6019 22.5 15.8849 22.5 11.3008C22.5 6.71613 17.799 3 12 3Z" fill="white"/>
-</svg>

layers/public/images/common/ic-v2-logo-x-fill.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M17.7534 3H20.8224L14.1187 10.6246L22 21H15.8248L10.994 14.7046L5.45851 21H2.3987L9.56606 12.84L2 3H8.33287L12.7 8.75077L17.7534 3ZM16.6778 19.1723H18.3746L7.40566 4.73538H5.57904L16.6778 19.1723Z" fill="white"/>
-</svg>