mirror of
https://github.com/TeamPiped/Piped.git
synced 2024-08-14 23:57:27 +00:00
42 lines
764 B
Vue
42 lines
764 B
Vue
|
<template>
|
||
|
<div class="flex min-h-[75vh] w-full justify-center items-center">
|
||
|
<span id="spinner"></span>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<style>
|
||
|
#spinner:after {
|
||
|
--spinner-color: #000;
|
||
|
}
|
||
|
|
||
|
.dark #spinner:after {
|
||
|
--spinner-color: #fff;
|
||
|
}
|
||
|
|
||
|
#spinner {
|
||
|
display: inline-block;
|
||
|
width: 70px;
|
||
|
height: 70px;
|
||
|
}
|
||
|
#spinner:after {
|
||
|
content: " ";
|
||
|
display: block;
|
||
|
width: 54px;
|
||
|
height: 54px;
|
||
|
margin: 8px;
|
||
|
border-radius: 50%;
|
||
|
border: 4px solid var(--spinner-color);
|
||
|
border-color: var(--spinner-color) transparent var(--spinner-color) transparent;
|
||
|
animation: spinner 1.2s linear infinite;
|
||
|
}
|
||
|
|
||
|
@keyframes spinner {
|
||
|
0% {
|
||
|
transform: rotate(0deg);
|
||
|
}
|
||
|
100% {
|
||
|
transform: rotate(360deg);
|
||
|
}
|
||
|
}
|
||
|
</style>
|