sam/pronounscc
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

feat(frontend): self host avatar placeholders

Browse source
This commit is contained in:
Sam 2023-03-25 22:14:04 +01:00
parent 67dae103d8
commit 0c187aaf84
Signed by: sam
GPG key ID: B4EF20DDE721CAA1
4 changed files with 15 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

9
frontend/src/lib/components/FallbackImage.svelte
View file

@ -1,4 +1,6 @@
<script lang="ts">
import { defaultAvatars } from "$lib/api/entities";
export let urls: string[];
export let alt: string;
export let width = 300;
@ -14,6 +16,8 @@
return "application/octet-stream";
}
};
$: urls = urls.length > 0 ? urls : defaultAvatars;
</script>
{#if urls.length > 0}
@ -21,9 +25,8 @@
{#each urls as url}
<source {width} srcSet={url} type={contentTypeFor(url)} />
{/each}
<img {width} src={urls[0]} {alt} class="rounded-circle img-fluid" />
<img {width} src={urls[0] || defaultAvatars[0]} {alt} class="rounded-circle img-fluid" />
</picture>
{:else}
<!-- TODO: actual placeholder that isn't a cat -->
<img {width} class="rounded-circle img-fluid" src="https://placekitten.com/512/512" {alt} />
<img {width} class="rounded-circle img-fluid" src={defaultAvatars[0]} {alt} />
{/if}