Unread badge is now attached to avatar in left pane

This commit is contained in:
Scott Nonnenberg 2018-09-26 15:55:13 -07:00
parent 10c53bddb0
commit cf16ced91c
3 changed files with 62 additions and 45 deletions

View file

@ -2011,6 +2011,9 @@
background-color: $color-gray-05;
}
.module-conversation-list-item__avatar-container {
position: relative;
}
.module-conversation-list-item__avatar {
margin-top: 8px;
margin-bottom: 8px;
@ -2064,6 +2067,31 @@
background-color: $color-conversation-blue_grey;
}
.module-conversation-list-item__unread-count {
color: $color-white;
background-color: $color-signal-blue;
text-align: center;
padding-top: 1px;
padding-left: 2px;
padding-right: 2px;
position: absolute;
right: -6px;
top: 6px;
font-weight: 300;
font-size: 11px;
letter-spacing: 0.25px;
height: 16px;
min-width: 16px;
line-height: 16px;
border-radius: 8px;
box-shadow: 0px 0px 1px 2px $color-white-05;
}
.module-conversation-list-item__content {
flex-grow: 1;
margin-left: 12px;
@ -2142,23 +2170,6 @@
font-weight: 300;
}
.module-conversation-list-item__unread-count {
color: $color-white;
background-color: $color-signal-blue;
text-align: center;
// For alignment with the message text
margin-top: 1px;
font-size: 10px;
margin-left: 5px;
min-width: 20px;
height: 20px;
width: 20px;
line-height: 20px;
border-radius: 10px;
}
.module-conversation-list-item__message__status-icon {
flex-shrink: 0;