audi/app/components/admin/AdminLoadingOverlay.vue

<template>
  <Transition name="loading-fade">
    <div v-if="isGlobalLoading" class="admin--loading-overlay">
      <div class="admin--spinner"></div>
    </div>
  </Transition>
</template>

<script setup>
import { useLoading } from '~/composables/useLoading'

const { isGlobalLoading } = useLoading()
</script>

<style scoped>
.loading-fade-enter-active,
.loading-fade-leave-active {
  transition: opacity 0.2s ease;
}

.loading-fade-enter-from,
.loading-fade-leave-to {
  opacity: 0;
}
</style>