diff options
| author | Fuwn <[email protected]> | 2024-02-19 17:24:04 -0800 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2024-02-19 17:24:04 -0800 |
| commit | aaecf0a4137880c9e97b02e73cb44c779c3a19cf (patch) | |
| tree | e66980ca4c8f1a2481c5556a8ad6305a7c569b06 /src | |
| parent | fix(popup): better light mode background-colour (diff) | |
| download | due.moe-aaecf0a4137880c9e97b02e73cb44c779c3a19cf.tar.xz due.moe-aaecf0a4137880c9e97b02e73cb44c779c3a19cf.zip | |
refactor(user): shift message layout
Diffstat (limited to 'src')
| -rw-r--r-- | src/lib/Loading/Skeleton.svelte | 5 | ||||
| -rw-r--r-- | src/routes/user/[user]/+page.svelte | 6 |
2 files changed, 5 insertions, 6 deletions
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 |