21 lines
554 B
Svelte
21 lines
554 B
Svelte
<script lang="ts">
|
|
export let username: string = '';
|
|
export let avatar: string = '/troll_haz2.png';
|
|
export let color: string = 'var(--base-400)';
|
|
export let size: string = 'var(--avatar-size)';
|
|
</script>
|
|
|
|
<button class="avatar pa-0 border-0" style:--color="{color}" style:--size="{size}" on:click>
|
|
<img src="{avatar}" alt="{`${username}'s avatar`}">
|
|
</button>
|
|
|
|
<style>
|
|
.avatar, .avatar > img {
|
|
width: var(--size);
|
|
height: var(--size);
|
|
border-radius: 9999px;
|
|
overflow: hidden;
|
|
background-color: var(--color);
|
|
}
|
|
</style>
|