div(
@click="onClick"
:class=`[
"gb-base-avatar",
"gb-base-avatar--" + size,
"gb-base-avatar--" + computedTheme,
{
"gb-base-avatar--animated": animated,
"gb-base-avatar--bordered": bordered,
"gb-base-avatar--circular": circular,
"gb-base-avatar--clickable": $listeners.click && clickable !== false,
"gb-base-avatar--secondaries": secondaries,
"gb-base-avatar--shadow": shadow
}
]`
)
span(
@keypress.prevent="onKeypress"
:style=`{ backgroundImage: "url(" + src + ")" }`
:tabindex="$listeners.click ? '0' : null"
class="gb-base-avatar__image"
)
span.gb-base-avatar__focuser
div(
v-if="secondaries"
class="gb-base-avatar__secondaries"
)
span(
v-for="secondary in secondaries"
:key="secondary.src"
:style=`{
backgroundImage: "url(" + secondary.src + ")",
}`
class="gb-base-avatar__image gb-base-avatar__secondary"
)
span(
v-if="description"
class="gb-base-avatar__description"
) {{ description }}