From 55a28d0f4dc32dc8a096c959053517942a0a591e Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Sun, 11 Feb 2024 10:07:25 -0800
Subject: feat(skeleton): animation delay implementation

---
 src/lib/Loading/Skeleton.svelte | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

(limited to 'src/lib/Loading')

diff --git a/src/lib/Loading/Skeleton.svelte b/src/lib/Loading/Skeleton.svelte
index c2df1e3f..08557685 100644
--- a/src/lib/Loading/Skeleton.svelte
+++ b/src/lib/Loading/Skeleton.svelte
@@ -10,9 +10,9 @@
 
 {#if grid}
 	<div class="grid" style={pad ? 'padding-top: .75em;' : ''}>
-		{#each Array(count) as _}
+		{#each Array(count) as _, i}
 			<div class={card ? 'card-small' : ''} style={`width: ${width};`}>
-				<div class="skeleton-container">
+				<div class="skeleton-container" style={`--i: ${i};`}>
 					<div class="skeleton" style={`width: ${width}; height: ${height};`} />
 				</div>
 			</div>
@@ -52,6 +52,7 @@
 		background-size: 200px 100%;
 		background-repeat: no-repeat;
 		border-radius: 8px;
+		/* animation-delay: calc(var(--i) * 0.01s); */
 	}
 
 	.skeleton {
-- 
cgit v1.2.3