Merge remote-tracking branch 'upstream/pull/4842'

diff --combined app/assets/stylesheets/common.scss
index 1329d05f4a644d8b4cc5188c151e6361ea5e18d5,9be17a83a34beb1786dbdd40cec9ec0e72be0f8d..edef1444b85b00a924d1ad554edef97cf832c059
--- 1/app/assets/stylesheets/common.scss
--- 2/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@@ -16,6 -16,8 +16,6 @@@ time[title] 
    text-decoration: underline dotted;
  }
  
 -#container { position: relative; }
 -
  /* Rules for icons */
  
  .icon {
@@@ -112,6 -114,10 +112,10 @@@ header 
    nav.primary {
      margin-right: auto;
    }
+ 
+   .username {
+     max-width: 12em;
+   }
  }
  
  nav.primary {
@@@ -485,6 -491,16 +489,6 @@@ body.small-nav 
  
  .donate-attr { color: darken($green, 10%) !important; }
  
 -/* Rules for the sidebar */
 -
 -#browse_status {
 -  input {
 -    display: block;
 -    margin-left: auto;
 -    margin-right: auto;
 -  }
 -}
 -
  /* Temporary label size override until we remove site-wide font customisation */
  
  form {
@@@ -566,6 -582,10 +570,6 @@@ tr.turn 
  
  .routing_marker { width: 15px; cursor: move; }
  
 -.browse_status {
 -  display: none;
 -}
 -
  /* Rules for the history sidebar */
  
  #sidebar .changesets {
@@@ -619,6 -639,16 +623,6 @@@
    }
  }
  
 -/* Bootstrap buttons don't have any vertical margin, so
 -   they touch when adjacent buttons wrap onto a new line
 -   e.g. wide form buttons on a narrow sidebar */
 -
 -.btn-wrapper {
 -  > .btn {
 -    margin-bottom: $spacer * 0.25;
 -  }
 -}
 -
  /* Force LTR/RTL alignment for placeholder text */
  
  .form-control::placeholder {

diff --combined app/views/layouts/_header.html.erb
index 95b2c5537a96e39d05b4a90883f3b235b53ccd8c,fdabea7cd162d24da68e560b71ea058701f2fabb..77ef647a0d7817877544df342fee46024963e338
--- 1/app/views/layouts/_header.html.erb
--- 2/app/views/layouts/_header.html.erb
+++ b/app/views/layouts/_header.html.erb
@@@ -81,12 -81,12 +81,12 @@@
      </ul>
      <% if current_user && current_user.id %>
        <div class='d-inline-flex dropdown user-menu logged-in'>
-         <button class='dropdown-toggle btn btn-outline-secondary border-secondary-subtle bg-body text-secondary px-2 py-1 flex-grow-1' type='button' data-bs-toggle='dropdown'>
+         <button class='d-flex gap-1 align-items-center justify-content-center dropdown-toggle btn btn-outline-secondary border-secondary-subtle bg-body text-secondary px-2 py-1 flex-grow-1' type='button' data-bs-toggle='dropdown'>
            <%= user_thumbnail_tiny(current_user, :width => 25, :height => 25, :class => "user_thumbnail_tiny rounded-1 bg-body") %>
            <% if current_user.new_messages.size > 0 %>
 -            <span class="badge count-number position-static"><%= current_user.new_messages.size %></span>
 +            <span class="badge count-number position-static m-1"><%= current_user.new_messages.size %></span>
            <% end %>
-           <span class='username align-middle'>
 -          <span class='username text-truncate'>
++          <span class='username align-middle text-truncate'>
              <%= current_user.display_name %>
            </span>
          </button>