users: Add ellipsis only on names and show the indicator always.

We now show the guest indicator even for long names and only
truncate the names in right sidebar and the message feed.

web/styles/message_row.css

@@ -363,6 +363,10 @@ $time_column_min_width: 42px; /* + padding */
                         white-space: normal;
                         display: inline;
                     }
+
+                    .sender_name_text {
+                        max-width: 100%;
+                    }
                 }
 
                 &.content_edit_mode {

web/styles/zulip.css

@@ -1784,8 +1784,13 @@ td.pointer {
 
     .sender_name_text {
         overflow: hidden;
-        text-overflow: ellipsis;
         white-space: nowrap;
+        display: inline-flex;
+
+        .user-name {
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
     }
 }
 

web/templates/presence_row.hbs

@@ -8,7 +8,7 @@
             {{#if user_list_style.WITH_STATUS}}
                 <div class="user-name-and-status-wrapper">
                     <div class="user-name-and-status-emoji">
-                        <span class="user-name">{{> user_full_name}}</span>
+                        {{> user_full_name}}
                         {{> status_emoji status_emoji_info}}
                     </div>
                     <span class="status-text">{{status_text}}</span>

web/templates/user_full_name.hbs

@@ -1,5 +1,5 @@
 {{#if should_add_guest_user_indicator}}
-{{#tr}}{name} <i class="guest-indicator">(guest)</i>{{/tr}}
+<span class="user-name">{{name}}</span>&nbsp;<i class="guest-indicator">({{t 'guest' }})</i>
 {{else}}
 <span class="user-name">{{name}}</span>
 {{/if}}