mirror of
				https://github.com/lingble/chatwoot.git
				synced 2025-11-03 20:48:07 +00:00 
			
		
		
		
	This PR adds RTL support to the web widget for improved right-to-left language compatibility, updates colors, and cleans up code. Fixes https://linear.app/chatwoot/issue/CW-4089/rtl-issues-on-widget https://github.com/chatwoot/chatwoot/issues/9791 Other PR: https://github.com/chatwoot/chatwoot/pull/11016
		
			
				
	
	
		
			36 lines
		
	
	
		
			741 B
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			36 lines
		
	
	
		
			741 B
		
	
	
	
		
			Vue
		
	
	
	
	
	
<script setup>
 | 
						|
import Thumbnail from 'dashboard/components/widgets/Thumbnail.vue';
 | 
						|
import { defineProps, computed } from 'vue';
 | 
						|
 | 
						|
const props = defineProps({
 | 
						|
  users: {
 | 
						|
    type: Array,
 | 
						|
    default: () => [],
 | 
						|
  },
 | 
						|
  limit: {
 | 
						|
    type: Number,
 | 
						|
    default: 4,
 | 
						|
  },
 | 
						|
});
 | 
						|
 | 
						|
const usersToDisplay = computed(() => props.users.slice(0, props.limit));
 | 
						|
</script>
 | 
						|
 | 
						|
<template>
 | 
						|
  <div class="flex">
 | 
						|
    <span
 | 
						|
      v-for="(user, index) in usersToDisplay"
 | 
						|
      :key="user.id"
 | 
						|
      :class="index ? 'ltr:-ml-4 rtl:-mr-4' : ''"
 | 
						|
      class="inline-block rounded-full text-white shadow-solid"
 | 
						|
    >
 | 
						|
      <Thumbnail
 | 
						|
        size="36px"
 | 
						|
        :username="user.name"
 | 
						|
        :src="user.avatar_url"
 | 
						|
        has-border
 | 
						|
      />
 | 
						|
    </span>
 | 
						|
  </div>
 | 
						|
</template>
 |