From aaecf0a4137880c9e97b02e73cb44c779c3a19cf Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Mon, 19 Feb 2024 17:24:04 -0800
Subject: refactor(user): shift message layout

---
 src/lib/Loading/Skeleton.svelte     | 5 +++--
 src/routes/user/[user]/+page.svelte | 6 ++----
 2 files changed, 5 insertions(+), 6 deletions(-)

(limited to 'src')

diff --git a/src/lib/Loading/Skeleton.svelte b/src/lib/Loading/Skeleton.svelte
index 08557685..9293a3a6 100644
--- a/src/lib/Loading/Skeleton.svelte
+++ b/src/lib/Loading/Skeleton.svelte
@@ -6,12 +6,13 @@
 	export let grid = false;
 	export let list = false;
 	export let pad = false;
+	export let bigCard = false;
 </script>
 
 {#if grid}
 	<div class="grid" style={pad ? 'padding-top: .75em;' : ''}>
 		{#each Array(count) as _, i}
-			<div class={card ? 'card-small' : ''} style={`width: ${width};`}>
+			<div class={card ? `${bigCard ? 'card' : ''} card-small` : ''} style={`width: ${width};`}>
 				<div class="skeleton-container" style={`--i: ${i};`}>
 					<div class="skeleton" style={`width: ${width}; height: ${height};`} />
 				</div>
@@ -21,7 +22,7 @@
 {:else}
 	{#each Array(count) as _, i}
 		<div
-			class={card ? 'card-small' : ''}
+			class={card ? `${bigCard ? 'card' : ''} card-small` : ''}
 			style={`width: ${width}; ${list ? 'padding-top: .75em;' : ''}`}
 		>
 			<div class="skeleton-container">
diff --git a/src/routes/user/[user]/+page.svelte b/src/routes/user/[user]/+page.svelte
index 2a420fce..1df6d49d 100644
--- a/src/routes/user/[user]/+page.svelte
+++ b/src/routes/user/[user]/+page.svelte
@@ -79,11 +79,9 @@
 			</p>
 		</Message>
 	{:else if userData === undefined}
-		<div class="card card-small">
-			<Message />
+		<Skeleton card={false} bigCard count={1} height="224px" />
 
-			<Skeleton card={false} count={1} height="224px" />
-		</div>
+		<Message message="Loading user profile ..." />
 	{:else}
 		<div class={userData ? 'card card-small' : 'card'}>
 			<div
-- 
cgit v1.2.3