scinote-web/app/views/protocols/_header.html.erb

<div class="protocol-repository-header"> 
  <% unless preview %>
    <div class="page-header repository-protocol-name">
      <%= render partial: "protocols/header/name_label.html.erb" %>
    </div>
  <% end %>

  <div class="protocol-info">
    <div class="created-at-block">
      <span class="fas block-icon fa-calendar-alt"></span>
      <span class="hidden-xs hidden-sm hidden-md"><%=t "protocols.header.created_at" %>:</span>
      <b><%= l(@protocol.created_at, format: :full) %></b>
    </div>

    <div class="last-modified-block">
      <span class="fas block-icon fa-calendar-alt"></span>
      <span class="hidden-xs hidden-sm hidden-md"><%=t "protocols.header.updated_at" %>:</span>
      <b data-role="updated-at-refresh"><%= render partial: "protocols/header/updated_at_label.html.erb" %></b>
    </div>

    <div class="added-by-block">
      <span class="fas block-icon fa-user"></span>
      <span class="hidden-xs hidden-sm hidden-md"><%=t "protocols.header.added_by" %>:</span>
      <b><%= @protocol.added_by.full_name %></b>
    </div>

    <div class="edit-authors-block">
      <div class="block-label">
        <span class="fas block-icon fa-graduation-cap"></span>
        <span class="hidden-xs hidden-sm hidden-md"><%=t "protocols.header.authors" %>:</span>
      </div>
      <div class="edit-authors-container">
        <%= render partial: "protocols/header/authors_label.html.erb", locals: {editable: !preview} %>
      </div>
    </div>

    <div class="keywords-block">
      <div class="block-label">
        <span class="fas block-icon fa-font"></span>
        <span class="hidden-xs hidden-sm hidden-md"><%=t "protocols.header.keywords" %>:</span>
      </div>
      <div class="key-words-container">
        <%= select_tag "keyword-input-field",  options_for_select(@protocol.protocol_keywords.map{|i| i.name}),{
          'data-placeholder': t("protocols.no_keywords"),
          'data-update-url': keywords_protocol_path(@protocol, format: :json),
          'data-view-mode': !can_manage_protocol_in_repository?(@protocol) || preview,
          class: 'hidden'
        } %>
      </div>
    </div>


    <div class="protocol-description">
      <%= render partial: "protocols/header/description_label.html.erb", locals: {edit_mode: !preview} %>
    </div>
  </div>
</div>