jaro/flowbite-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix styling on non-default placeholder

Browse Source
This commit is contained in:
Jim Kriz
2023-04-05 04:51:41 -04:00
parent 7e1626f53c
commit d40c9dcc32
1 changed files with 13 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/Avatar/Avatar.vue
View File

@@ -1,13 +1,19 @@
<template>
<div class="relative">
<img v-if="img && !imageError" :class="avatarClasses" :src="img" :alt="alt" @error="setImageError">
<div v-else :class="avatarPlaceholderWrapperClasses">
<svg v-if="!initials && !hasPlaceholder" :class="avatarPlaceholderClasses" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<template v-else>
<div v-if="initials" :class="avatarPlaceholderWrapperClasses">
<div :class="avatarPlaceholderInitialsClasses">{{ initials }}</div>
</div>
<div v-else-if="!initials && !hasPlaceholder" :class="avatarPlaceholderWrapperClasses">
<svg :class="avatarPlaceholderClasses" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z" clip-rule="evenodd"></path>
</svg>
<slot v-else-if="!initials && hasPlaceholder" name="placeholder" />
<div v-else :class="avatarPlaceholderInitialsClasses">{{ initials }}</div>
</div>
<div v-else :class="avatarClasses">
<slot name="placeholder" />
</div>
</template>
<span v-if="status" :class="avatarDotClasses" :data-pos="statusPosition"></span>
</div>
</template>