Files
web/app/components/common/Avatarbox.vue
2026-06-26 17:23:57 +07:00

37 lines
752 B
Vue

<script setup>
const props = defineProps({
text: String,
image: String,
type: String,
size: String,
});
</script>
<template>
<div
@click="$emit('justclick')"
class="avatarbox rounded-full mx-0 px-0 size-9 font-bold is-flex is-justify-content-center is-align-items-center"
:style="{
border: image ? 'none' : '1px solid var(--bulma-grey-90)',
}"
>
<figure
v-if="image"
class="image"
>
<img
class="is-rounded"
:src="`${$path()}download?name=${image}`"
/>
</figure>
<span v-else>{{ text }}</span>
</div>
</template>
<style scoped>
.avatarbox:hover {
background-color: var(--bulma-grey-100);
&:hover {
background-color: var(--bulma-grey-95);
}
}
</style>