CviLux_fe/src/components/Loading.vue
2024-10-03 12:03:45 +08:00

33 lines
570 B
Vue

<script setup></script>
<template>
<div class="w-full h-full flex items-center justify-center">
<div class="loader"></div>
</div>
</template>
<style lang="css" scoped>
.loader {
width: 20%;
height: 22px;
border-radius: 20px;
color: theme(colors.success);
border: 2px solid theme(colors.success);
position: relative;
}
.loader::before {
content: "";
position: absolute;
margin: 2px;
inset: 0 100% 0 0;
border-radius: inherit;
background: currentColor;
animation: l6 2s infinite;
}
@keyframes l6 {
100% {
inset: 0;
}
}
</style>