aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
authorFuwn <[email protected]>2024-01-04 23:50:38 -0800
committerFuwn <[email protected]>2024-01-04 23:50:38 -0800
commit2c8afd4faf8cec1179a4eed804167cfd8e80c272 (patch)
tree3437a71192675d2f1cdb8eb22007083ef60c18b1 /src
parentfix(badges): grid spacing (diff)
downloaddue.moe-2c8afd4faf8cec1179a4eed804167cfd8e80c272.tar.xz
due.moe-2c8afd4faf8cec1179a4eed804167cfd8e80c272.zip
refactor(badges): move ui to card
Diffstat (limited to 'src')
-rw-r--r--src/routes/user/[user]/badges/+page.svelte32
1 files changed, 19 insertions, 13 deletions
diff --git a/src/routes/user/[user]/badges/+page.svelte b/src/routes/user/[user]/badges/+page.svelte
index 936ff54e..e0ca15d5 100644
--- a/src/routes/user/[user]/badges/+page.svelte
+++ b/src/routes/user/[user]/badges/+page.svelte
@@ -203,8 +203,8 @@
{:then identity}
{@const isOwner = identity && identity.name === data.username}
- {#if isOwner}
- <p>
+ <div class="card">
+ {#if isOwner}
<a href={`/user/${data.username}`}>Back to Profile</a>
<button
@@ -221,15 +221,15 @@
<input type="checkbox" bind:checked={dark} /> Dark Mode
<input type="checkbox" bind:checked={transparent} /> Transparent Background
- </p>
- {/if}
-
- {#if editMode && isOwner}
- {#if error}
- <p style="color: red;">{error}</p>
{/if}
- <p>
+ {#if editMode && isOwner}
+ <p />
+
+ {#if error}
+ <p style="color: red;">{error}</p>
+ {/if}
+
<input
type="text"
placeholder="Image URL"
@@ -289,8 +289,10 @@
/>
<small>Must be full date and time, defaults to now if any fields empty</small>
</span>
- </p>
- {/if}
+ {/if}
+ </div>
+
+ <p />
{#await badgesPromise}
<Loading type="badges" percent={40} />
@@ -301,9 +303,13 @@
{:then ungroupedBadges}
<div id="badges">
{#if ungroupedBadges === null}
- {@html nbsp('Loading badges ... 50%')}
+ <Loading>
+ {@html nbsp('Loading badges ... 50%')}
+ </Loading>
{:else if ungroupedBadges.length === 0}
- {@html nbsp('No badges found for this user.')}
+ <div class="card">
+ {@html nbsp('No badges found for this user.')}
+ </div>
{:else}
{@const groupedBadges = Object.entries(groupBadges(ungroupedBadges))}