LeadMagnet/leadchat
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

fix: Fixes overlaps for name in conversation header (#1978)

Browse Source 
* Fix width of text

* Review fixes

* Use mixins

* user name textoverflow

* Review fixes: Remove changes in text-truncate class

Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Co-authored-by: Nithin David Thomas <webofnithin@gmail.com>
This commit is contained in:
Pranjal Kushwaha
2021-05-07 18:28:47 +05:30
committed by GitHub
parent 4c47d6fd97
commit 899ddcef0d
2 changed files with 7 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
app/javascript/dashboard/assets/scss/widgets/_conv-header.scss
View File

@@ -39,20 +39,25 @@ $resolve-button-width: 13.2rem;
.user { .user {
@include flex; @include flex;
@include flex-align($x: center, $y: middle); @include flex-align($x: center, $y: middle);
margin-right: var(--space-normal);
min-width: 0;
.user--name { .user--name {
@include margin(0); @include margin(0);
display: inline-block;
font-size: $font-size-medium; font-size: $font-size-medium;
line-height: 1.3; line-height: 1.3;
text-transform: capitalize; text-transform: capitalize;
width: 100%;
} }
.user--profile__meta { .user--profile__meta {
align-items: flex-start; align-items: flex-start;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: flex-start;
margin-left: $space-slab; margin-left: $space-slab;
min-width: 0;
} }
.user--profile__button { .user--profile__button {

1
app/javascript/dashboard/components/widgets/conversation/ConversationBox.vue
View File

@@ -80,6 +80,7 @@ export default {
.conversation-details-wrap { .conversation-details-wrap {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
min-width: 0;
width: 100%; width: 100%;
border-left: 1px solid var(--color-border); border-left: 1px solid var(--color-border);
background: var(--color-background-light); background: var(--color-background-light);