fix: Truncates overlapping name in contact table (#2208)
This commit is contained in:
parent
7c7f91e70f
commit
8bcac2aab0
1 changed files with 23 additions and 16 deletions
|
@ -69,25 +69,28 @@ export default {
|
|||
align: 'left',
|
||||
width: 300,
|
||||
renderBodyCell: ({ row }) => (
|
||||
<button
|
||||
class="row--user-block cursor-pointer"
|
||||
<WootButton
|
||||
variant="clear"
|
||||
size="expanded"
|
||||
onClick={() => this.onClickContact(row.id)}
|
||||
>
|
||||
<Thumbnail
|
||||
src={row.thumbnail}
|
||||
size="36px"
|
||||
username={row.name}
|
||||
status={row.availability_status}
|
||||
/>
|
||||
<div>
|
||||
<h6 class="sub-block-title user-name text-truncate">
|
||||
{row.name}
|
||||
</h6>
|
||||
<button class="button clear small">
|
||||
{this.$t('CONTACTS_PAGE.LIST.VIEW_DETAILS')}
|
||||
</button>
|
||||
<div class="row--user-block">
|
||||
<Thumbnail
|
||||
src={row.thumbnail}
|
||||
size="36px"
|
||||
username={row.name}
|
||||
status={row.availability_status}
|
||||
/>
|
||||
<div class="user-block">
|
||||
<h6 class="sub-block-title user-name text-truncate">
|
||||
{row.name}
|
||||
</h6>
|
||||
<span class="button clear small">
|
||||
{this.$t('CONTACTS_PAGE.LIST.VIEW_DETAILS')}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
</WootButton>
|
||||
),
|
||||
},
|
||||
{
|
||||
|
@ -225,6 +228,10 @@ export default {
|
|||
display: flex;
|
||||
text-align: left;
|
||||
|
||||
.user-block {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.user-thumbnail-box {
|
||||
margin-right: var(--space-small);
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue