init

2024-03-13 00:30:45 +01:00
commit d761a10bf7
102 changed files with 4761 additions and 0 deletions
@@ -0,0 +1,52 @@
+<script lang="ts">
+  import { page } from '$app/stores';
+  import { getUserAvatar } from '$lib/config';
+  import { editorStore } from '$lib/stores/editor';
+
+  export let loadTime: number | undefined = undefined;
+  export let uniqueId: string | undefined = undefined;
+  export let align: BioSiteAlign = 'LEFT';
+  export let small: boolean = false;
+  export let tiny: boolean = false;
+  export let veryTiny: boolean = false;
+
+  $: noAvatar =
+    ($page.data.bio?.hasAvatar !== true && $editorStore.avatar == null) ||
+    $editorStore.edits.edits.deleteAvatar != null;
+
+  $: isEditor = $page.url.pathname.startsWith('/dashboard');
+  $: avatar = noAvatar
+    ? undefined
+    : $editorStore.avatar
+    ? $editorStore.avatar
+    : uniqueId
+    ? getUserAvatar(uniqueId, isEditor ? loadTime : undefined)
+    : undefined;
+</script>
+
+<div
+  class="w-24 h-24 rounded-3xl avatar bg-center bg-cover"
+  class:self-center={align === 'CENTER'}
+  class:self-end={align === 'RIGHT'}
+  class:small
+  class:tiny
+  class:very-tiny={veryTiny}
+  style="--avatar: url({avatar ?? '/assets/default/avatar.svg'})" />
+
+<style lang="postcss">
+  div.avatar {
+    background-image: var(--avatar);
+  }
+
+  div.small {
+    @apply w-16 h-16 rounded-2xl;
+  }
+
+  div.tiny {
+    @apply w-9 h-9 rounded-full;
+  }
+
+  div.very-tiny {
+    @apply w-6 h-6 rounded-full;
+  }
+</style>