fixed user avatar alt text overflow

Author: Oaphi

app/assets/stylesheets/users.scss

@@ -1,5 +1,16 @@
 @import 'variables';
 
+img {
+  &.header--item-image {
+    &.user-avatar {
+      align-items: center;
+      display: flex;
+      font-size: 0.75em;
+      overflow: hidden;
+    }
+  }
+}
+
 .user-list {
   display: grid;
   gap: 1em;

app/views/layouts/_header.html.erb

@@ -84,7 +84,9 @@ $(() => {
         </a>
         <%= link_to user_path(current_user), class: 'header--item is-complex is-visible-on-mobile',
                                              title: 'Manage profile' do %>
-          <img alt="user avatar" src="<%= avatar_url(current_user, 40) %>" class="header--item-image avatar-40">&nbsp;&nbsp;
+          <img alt="user avatar"
+               src="<%= avatar_url(current_user, 40) %>"
+               class="header--item-image user-avatar avatar-40">&nbsp;&nbsp;
           <span class="<%= SiteSetting['SiteHeaderIsDark'] ? 'has-color-white' : 'has-color-tertiary-600' %>"><%= current_user.reputation %></span>
         <% end %>
       <% end %>