mirror of
				https://github.com/lingble/chatwoot.git
				synced 2025-11-04 04:57:51 +00:00 
			
		
		
		
	
		
			
				
	
	
		
			47 lines
		
	
	
		
			864 B
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			47 lines
		
	
	
		
			864 B
		
	
	
	
		
			Vue
		
	
	
	
	
	
<template>
 | 
						|
  <div class="avatars">
 | 
						|
    <span v-for="user in users" :key="user.id" class="avatar">
 | 
						|
      <Thumbnail
 | 
						|
        size="24px"
 | 
						|
        :username="user.name"
 | 
						|
        :src="user.avatar"
 | 
						|
        has-border
 | 
						|
      />
 | 
						|
    </span>
 | 
						|
  </div>
 | 
						|
</template>
 | 
						|
 | 
						|
<script>
 | 
						|
import Thumbnail from 'dashboard/components/widgets/Thumbnail.vue';
 | 
						|
 | 
						|
export default {
 | 
						|
  name: 'GroupedAvatars',
 | 
						|
  components: { Thumbnail },
 | 
						|
  props: {
 | 
						|
    users: {
 | 
						|
      type: Array,
 | 
						|
      default: () => [],
 | 
						|
    },
 | 
						|
  },
 | 
						|
};
 | 
						|
</script>
 | 
						|
 | 
						|
<style scoped lang="scss">
 | 
						|
@import '~widget/assets/scss/variables.scss';
 | 
						|
@import '~widget/assets/scss/mixins.scss';
 | 
						|
 | 
						|
.avatars {
 | 
						|
  display: inline-block;
 | 
						|
  padding-left: $space-one;
 | 
						|
 | 
						|
  .avatar {
 | 
						|
    margin-left: -$space-slab;
 | 
						|
    position: relative;
 | 
						|
    display: inline-block;
 | 
						|
    overflow: hidden;
 | 
						|
    width: $space-medium;
 | 
						|
    height: $space-medium;
 | 
						|
  }
 | 
						|
}
 | 
						|
</style>
 |