diff options
Diffstat (limited to 'src/components/Avatar.svelte')
| -rw-r--r-- | src/components/Avatar.svelte | 22 |
1 files changed, 17 insertions, 5 deletions
diff --git a/src/components/Avatar.svelte b/src/components/Avatar.svelte index 3007c3e7..04f346b1 100644 --- a/src/components/Avatar.svelte +++ b/src/components/Avatar.svelte @@ -1,5 +1,5 @@ <script lang="ts"> - import { run } from 'svelte/legacy'; + import { run } from "svelte/legacy"; import { avatar, banner } from "$lib/store"; import Icon from "$comp/Icon.svelte"; @@ -17,8 +17,12 @@ let link = $derived(user?.anon ? `/${user.pubkey}` : `/${user.username}`); let base = "/api/public"; - let profile = $derived(user?.profile ? `${base}/${user.profile}.webp` : user?.picture); - let fallback = $derived(`${base}/punks/` + punk(user.pubkey || user.id || "aa")); + let profile = $derived( + user?.profile ? `${base}/${user.profile}.webp` : user?.picture, + ); + let fallback = $derived( + `${base}/punks/` + punk(user.pubkey || user.id || "aa"), + ); let tmp = $derived($avatar?.id && $avatar.id === user.id && $avatar.src); let src; run(() => { @@ -28,7 +32,7 @@ let handle = () => (src = fallback); </script> -<a href={link} class:pointer-events-none={disabled}> +{#snippet body()} <div class="w-{s} h-{s} rounded-full border-4 border-base-100 overflow-hidden bg-gradient-to-r from-primary to-gradient flex justify-center items-center" > @@ -39,4 +43,12 @@ onerror={handle} /> </div> -</a> +{/snippet} + +{#if disabled} + {@render body()} +{:else} + <a href={link} class:pointer-events-none={disabled}> + {@render body()} + </a> +{/if} |