diff --git a/web/styles/left_sidebar.css b/web/styles/left_sidebar.css
index b30932ae0f..39a5c3f3f1 100644
--- a/web/styles/left_sidebar.css
+++ b/web/styles/left_sidebar.css
@@ -573,6 +573,15 @@ li.top_left_scheduled_messages {
.conversation-partners {
line-height: 1.25;
+ display: flex;
+ width: 100%;
+ overflow: hidden;
+}
+
+.conversation-partners .status-emoji {
+ /* Prevent status emoji from colliding
+ with unread counts. */
+ margin-right: 3px;
}
.top_left_all_messages i.fa-align-left {
@@ -598,7 +607,7 @@ li.top_left_scheduled_messages {
height: 20px;
}
-.conversation-partners,
+.conversation-partners-list,
.topic-name,
.stream-name {
flex: auto;
@@ -610,6 +619,12 @@ li.top_left_scheduled_messages {
padding: 1px $before_unread_count_padding 1px 0;
}
+.conversation-partners-list {
+ /* Don't allow growth, so that status emoji
+ remain adjacent the username. */
+ flex: 0 1 auto;
+}
+
.topic-name {
/* TODO: We should figure out how to remove this without changing the spacing */
line-height: 1.1;
diff --git a/web/templates/pm_list_item.hbs b/web/templates/pm_list_item.hbs
index 66e41c9401..19f9a0ab57 100644
--- a/web/templates/pm_list_item.hbs
+++ b/web/templates/pm_list_item.hbs
@@ -12,7 +12,7 @@
- {{recipients}}
+ {{recipients}}
{{> status_emoji status_emoji_info}}