Sharkey/src/client/app/common/views/components/avatar.vue

40 lines
851 B
Vue
Raw Normal View History

2018-04-29 11:17:15 +03:00
<template>
<router-link class="mk-avatar" :to="user | userPage" :title="user | acct" :target="target" :style="{ borderRadius: clientSettings.circleIcons ? '100%' : null }">
<img v-if="disablePreview" :src="`${user.avatarUrl}?thumbnail&size=128`" alt=""/>
<img v-else :src="`${user.avatarUrl}?thumbnail&size=128`" alt="" v-user-preview="user.id"/>
</router-link>
</template>
<script lang="ts">
import Vue from 'vue';
export default Vue.extend({
props: {
user: {
required: true
},
target: {
required: false,
default: null
},
disablePreview: {
required: false,
default: false
}
}
});
</script>
<style lang="stylus" scoped>
.mk-avatar
2018-05-04 11:40:50 +03:00
display inline-block
2018-04-29 11:17:15 +03:00
> img
display inline-block
width 100%
height 100%
margin 0
border-radius inherit
vertical-align bottom
2018-04-29 15:35:18 +03:00
transition border-radius 1s ease
2018-04-29 11:17:15 +03:00
</style>