Joseph.Rawlings/Virtnet.bond
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

style: use exact l20 animation from user spec with #514b82 color

Browse Source
This commit is contained in:
Joseph.Rawlings
2026-01-24 21:17:57 -05:00
parent cc8b999969
commit b19f08b0d4
1 changed files with 6 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
themes/lucentui/css/app.css
View File

@@ -636,12 +636,12 @@ x-navigation-link svg {
.loader {
display: inline-block;
width: 1em;
height: 1em;
aspect-ratio: 1;
border-radius: 50%;
border: 2px solid var(--primary, #6366f1);
border: 2px solid var(--primary, #514b82);
animation:
loader-clip 0.8s infinite linear alternate,
loader-rotate 1.6s infinite linear;
l20-1 0.8s infinite linear alternate,
l20-2 1.6s infinite linear;
}
/* Use currentColor variant when inside colored buttons */
@@ -651,16 +651,14 @@ x-navigation-link svg {
.loader-sm {
width: 0.875em;
height: 0.875em;
}
.loader-lg {
width: 1.25em;
height: 1.25em;
border-width: 3px;
}
@keyframes loader-clip {
@keyframes l20-1 {
0% { clip-path: polygon(50% 50%, 0 0, 50% 0%, 50% 0%, 50% 0%, 50% 0%, 50% 0%); }
12.5% { clip-path: polygon(50% 50%, 0 0, 50% 0%, 100% 0%, 100% 0%, 100% 0%, 100% 0%); }
25% { clip-path: polygon(50% 50%, 0 0, 50% 0%, 100% 0%, 100% 100%, 100% 100%, 100% 100%); }
@@ -670,7 +668,7 @@ x-navigation-link svg {
100% { clip-path: polygon(50% 50%, 50% 100%, 50% 100%, 50% 100%, 50% 100%, 50% 100%, 0% 100%); }
}
@keyframes loader-rotate {
@keyframes l20-2 {
0% { transform: scaleY(1) rotate(0deg); }
49.99% { transform: scaleY(1) rotate(135deg); }
50% { transform: scaleY(-1) rotate(0deg); }