Foxnouns.NET/Foxnouns.Frontend/src/lib/components/Avatar.svelte
2024-11-25 17:35:24 +01:00

23 lines
467 B
Svelte

<script lang="ts">
import { DEFAULT_AVATAR } from "$lib";
type Props = { url: string | null; alt: string; lazyLoad?: boolean; size?: number };
let { url, alt, lazyLoad, size }: Props = $props();
let width = $derived(size || 200);
</script>
<img
class="rounded-circle img-fluid"
style="height: {width}px; width: {width}px"
src={url || DEFAULT_AVATAR}
{alt}
{width}
loading={lazyLoad ? "lazy" : "eager"}
/>
<style>
img {
object-fit: cover;
}
</style>