Fix CSS for protocol versioning modal [SCI-8194] (#5197)

app/assets/stylesheets/protocols/index.scss

@@ -209,15 +209,40 @@
     flex-wrap: wrap;
     padding: 1em 0;
 
+    .protocol-version-metadata {
+      display: flex;
+      flex-wrap: nowrap;
+      width: 100%;
+
+      .protocol-link {
+        @include font-button;
+        flex-shrink: 0;
+      }
+
       .protocol-actions {
         display: flex;
         margin-left: auto;
         min-height: 36px;
       }
 
+      .edit-buttons {
+        margin-top: .25em;
+
+        .btn {
+          margin-left: .5em;
+        }
+      }
+
+      .protocol-metadata {
+        @include font-small;
+        margin-left: 16px;
+      }
+    }
+
     &:not(:hover) {
       .save-as-draft {
-        display: none;
+        opacity: 0;
+        pointer-events: none;
       }
     }
 
@@ -250,16 +275,6 @@
         width: 100%;
       }
 
-      .edit-buttons {
-        display: flex;
-        justify-content: end;
-        margin-top: .25em;
-
-        .btn {
-          margin-left: .5em;
-        }
-      }
-
       .protocol-comment-container {
         &[data-edit-mode="0"] {
           .edit-buttons {
@@ -268,12 +283,6 @@
         }
       }
     }
-
-    .protocol-metadata {
-      @include font-small;
-      margin-left: 16px;
-      max-width: 220px;
-    }
   }
 
   .protocol-version-link {

app/views/protocols/index/_protocol_versions_modal.html.erb

@@ -11,6 +11,7 @@
         <% if @protocol.initial_draft? || @protocol.draft.present? %>
           <% draft = @protocol.initial_draft? ? @protocol : @protocol.draft %>
           <div class="protocol-version-row">
+            <div class="protocol-version-metadata">
               <div class="protocol-link">
                 <%= link_to protocol_path(draft) do %>
                   <% if draft.previous_version %>
@@ -43,6 +44,7 @@
                   </div>
                 <% end %>
               </div>
+            </div>
             <div class="protocol-version-comment">
               <% if can_manage_protocol_draft_in_repository?(draft) %>
                 <div
@@ -71,6 +73,7 @@
         <% end %>
         <% @published_versions.each do |protocol_version| %>
           <div class="protocol-version-row">
+            <div class="protocol-version-metadata">
               <div class="protocol-link">
                 <%= link_to protocol_path(protocol_version) do %>
                   <b><%= t('protocols.index.versions.revision', version: protocol_version.version_number) %></b>
@@ -95,6 +98,7 @@
                   <% end %>
                 <% end %>
               </div>
+            </div>
             <div class="protocol-version-comment">
               <%= protocol_version.version_comment %>
             </div>

config/locales/en.yml

@@ -2671,7 +2671,7 @@ en:
     publish_modal:
       title: "Publish version %{version} of the protocol template"
       name: "Protocol template name"
-      comment: "Revision comment"
+      comment: "Revision notes"
       comment_placeholder: "What's new in this version?"
       publish: "Publish"
     new_protocol_modal: