Fix various CSS issues [SCI-8940]

- Maintain the position of the top navigation controls when user is without team.
- Add "missing" avatar to avatar change modal
- Disable wrapping of (A) in archived P/E/T
- Fix padding/margin issues in Archived tasks and Protocol templates

app/assets/stylesheets/label_templates/show.scss

@@ -12,9 +12,9 @@
     background: $color-white;
     border-bottom: $border-tertiary;
     display: flex;
-    margin-left: -2em;
+    margin: 0 -2em;
     padding: .25em 2em;
-    width: calc(100% + 4em);
+    width: calc(100% + 3em);
 
     .label-template-icon {
       flex-shrink: 0;

app/assets/stylesheets/projects.scss

@@ -300,7 +300,7 @@ path, ._jsPlumb_endpoint {
   }
 
   .designated-users-task-title {
-    padding-left: 15px;
+    padding: 7px 0 0 15px;
   }
 
   .user-role {

app/assets/stylesheets/protocols/protocol.scss

@@ -6,7 +6,7 @@
 
 .content-pane.protocols-show {
   background-color: $color-alto;
-  min-height: calc(100vh - var(--navbar-height));
+  min-height: calc(100vh - var(--navbar-height) - 40px);
   overflow: hidden;
   padding: 0 0 10px;
 

app/assets/stylesheets/themes/scinote.scss

@@ -1255,6 +1255,7 @@ body > .loading-overlay {
 
   .avatar-image {
     position: absolute;
+    width: 100%;
 
     img {
       border-radius: 50%;

app/javascript/vue/navigation/top_menu.vue

@@ -4,7 +4,7 @@
       <input type="text" :placeholder="i18n.t('nav.search')" @change="searchValue"/>
       <i class="sn-icon sn-icon-search"></i>
     </div>
-    <div v-if="currentTeam" class="mr-auto w-64">
+    <div v-if="currentTeam" class="w-64">
       <Select
         :value="currentTeam"
         :options="teams"
@@ -14,7 +14,7 @@
         @change="switchTeam"
       ></Select>
     </div>
-    <div v-if="user" class="dropdown" >
+    <div v-if="user" class="ml-auto dropdown" >
       <button class="btn btn-light icon-btn btn-black" data-toggle="dropdown" :title="i18n.t('nav.support')">
         <i class="sn-icon sn-icon-help"></i>
       </button>

app/views/experiments/_show_header.html.erb

@@ -3,7 +3,7 @@
     <i class="sn-icon sn-icon-navigator sci--layout--navigator-open cursor-pointer p-1.5 border rounded border-sn-light-grey mr-4"></i>
     <h1 class="experimnet-name" data-toggle="tooltip" data-placement="bottom" title="<%= @experiment.name %>">
       <% if @experiment.archived_branch? %>
-        <span><%= t('labels.archived')%></span>&nbsp;
+        <span class="whitespace-nowrap"><%= t('labels.archived')%></span>&nbsp;
       <% end %>
       <% if @inline_editable_title_config.present? %>
               <%= render partial: "shared/inline_editing",

app/views/my_modules/_header.html.erb

@@ -3,7 +3,7 @@
     <i class="sn-icon sn-icon-navigator sci--layout--navigator-open cursor-pointer p-1.5 border rounded border-sn-light-grey mr-4"></i>
     <h1 class="my_module-name" data-toggle="tooltip" data-placement="bottom" title="<%= @my_module.name %>">
       <% if @my_module.archived_branch? %>
-        <span><%= t('labels.archived')%></span>&nbsp;
+        <span class="whitespace-nowrap"><%= t('labels.archived')%></span>&nbsp;
       <% end %>
       <% if @inline_editable_title_config.present? %>
               <%= render partial: "shared/inline_editing",

app/views/projects/show/_header.html.erb

@@ -3,7 +3,7 @@
     <i class="sn-icon sn-icon-navigator sci--layout--navigator-open cursor-pointer p-1.5 border rounded border-sn-light-grey mr-4"></i>
     <h1 class="project-name">
       <% if @project.archived? %>
-        <span><%= t('labels.archived')%></span>&nbsp;
+        <span class="whitespace-nowrap"><%= t('labels.archived')%></span>&nbsp;
       <% end %>
       <% if @inline_editable_title_config.present? %>
               <%= render partial: "shared/inline_editing",

app/views/users/shared/_user_avatars_modal.html.erb

@@ -12,7 +12,7 @@
         <div class="modal-body">
           <div class="upload-block">
               <div class="current-avatar">
-                <%= image_tag avatar_path(current_user, :medium) %>
+                <%= image_tag avatar_path(current_user, :thumb) %>
                 <%= file_field_tag :raw_avatar, style: "display:none" %>
                 <%= hidden_field_tag :new_avatar, "" %>
               </div>