realm_user_settings: Fix user status with emoji preview.

Fixed to reflect how user status with emoji will be displayed
in the right sidebar.
This commit is contained in:
Aman Agrawal
2022-10-03 15:49:39 +00:00
committed by Tim Abbott
parent 5a5ec5518c
commit a29009b4d9

View File

@@ -1,3 +1,6 @@
/* Width of emoji used by user to display status. */
$user_status_emoji_width: 24px;
.right-sidebar {
a:hover {
text-decoration: none;
@@ -115,7 +118,7 @@
}
.user-presence-link {
width: calc(100% - 24px);
width: calc(100% - $user_status_emoji_width);
.status_emoji {
top: 9px;
@@ -130,6 +133,31 @@
cursor: pointer;
}
.user_list_style_values {
.user-name-and-status-emoji {
display: block;
width: 100%;
height: 20px;
.user-name {
display: inline-block;
max-width: calc(100% - $user_status_emoji_width);
overflow-x: hidden;
text-overflow: ellipsis;
}
.status_emoji {
line-height: 20px;
top: -2px;
}
}
.status-text {
overflow-x: hidden;
text-overflow: ellipsis;
}
}
.user_sidebar_entry {
display: flex;
align-items: flex-start;