fix: Truncates overlapping name in contact table (#2208)

This commit is contained in:
Nithin David Thomas 2021-05-04 15:21:34 +05:30 committed by GitHub
parent 7c7f91e70f
commit 8bcac2aab0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -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);
}