Moonlight-Panel/Moonlight
2
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Updated loader style so the table loader is working again

Browse Source
This commit is contained in:
ChiaraBm
2025-03-24 21:20:21 +01:00
parent f1adba4fa6
commit 3f511cefa8
1 changed files with 24 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
Moonlight.Client/Styles/additions/loaders.css
View File

@@ -1,19 +1,28 @@
.loader { .loader-spinner {
width: 42px; width: 2.5rem;
height: 42px; height: 2.5rem;
border: 3px solid #FFF;
border-bottom-color: transparent;
border-radius: 50%; border-radius: 50%;
display: inline-block; position: relative;
animation: loader-spinner-rotate 1s linear infinite
}
.loader-spinner::before {
content: "";
box-sizing: border-box; box-sizing: border-box;
animation: loader-rotation 1s linear infinite; position: absolute;
inset: 0px;
border-radius: 50%;
border: 3px solid #FFF;
animation: loader-spinner-prixClipFix 2s linear infinite ;
} }
@keyframes loader-rotation { @keyframes loader-spinner-rotate {
0% { 100% {transform: rotate(360deg)}
transform: rotate(0deg); }
}
100% { @keyframes loader-spinner-prixClipFix {
transform: rotate(360deg); 0% {clip-path:polygon(50% 50%,0 0,0 0,0 0,0 0,0 0)}
} 25% {clip-path:polygon(50% 50%,0 0,100% 0,100% 0,100% 0,100% 0)}
} 50% {clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,100% 100%,100% 100%)}
75% {clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,0 100%,0 100%)}
100% {clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,0 100%,0 0)}
}