<script setup lang="ts"></script>

<template>
  <div class="no-data-box">
    <img class="no-data-img" src="@/assets/common/image/no-data.svg" />
    <div class="no-data-text">{{ $t('COMMON_NO_DATA') }}</div>
  </div>
</template>

<style scoped lang="scss">
.no-data-box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;

  .no-data-img {
    margin-bottom: 8px;
  }

  .no-data-text {
    color: var(--o-text-color-tertiary);
  }
}
</style>
