scinote-web/app/views/projects/show/_experiment_card.html.erb

<div class="card experiment-card"
     data-id="<%= experiment.id %>"
     data-edit-url=""
     data-editable="<%= can_manage_experiment?(experiment) %>"
     data-moveable="<%= can_move_experiment?(experiment) %>"
     data-archivable="<%= experiment.active? && can_archive_experiment?(experiment) %>"
     data-restorable="<%= experiment.archived? && can_restore_experiment?(experiment) %>">

  <div class="checkbox-cell table-cell">
    <div class="sci-checkbox-container">
      <input value="1" type="checkbox" class="sci-checkbox experiment-card-selector">
      <span class="sci-checkbox-label"></span>
    </div>
  </div>

  <div class="experiment-name-cell table-cell">
    <% if experiment.archived_branch? %>
      <%= link_to experiment.name, module_archive_experiment_path(experiment), title: experiment.name %>
    <% else %>
      <%= link_to experiment.name, canvas_experiment_path(experiment), title: experiment.name %>
    <% end %>
  </div>
  <div class="actions actions-cell table-cell">
    <div class="dropdown experiment-actions-menu">
      <button class="btn btn-light dropdown-toggle icon-btn">
        <i class="fas fa-ellipsis-h"></i>
      </button>
    </div>
  </div>
  <div class="dates-and-img-container">
    <div class="dates-container">
      <div class="data-row start-date-cell table-cell">
        <span class="card-label"><%= t('experiments.card.start_date') %></span>
        <span class="card-value"><%= l(experiment.created_at, format: :full_date) %></span>
      </div>
      <div class="data-row modified-date-cell table-cell">
        <span class="card-label"><%= t('experiments.card.modified_date') %></span>
        <span class="card-value"><%= l(experiment.updated_at, format: :full_date) %></span>
      </div>
      <div class="data-row completed-task-cell table-cell">
        <span class="card-label"><%= t('experiments.card.completed_task') %></span>
        <span class="card-value"><%= t('experiments.card.completed_value', completed: 12, all: 16) %></span>
      </div>
    </div>
    <div class="workflow-img-container">
    </div>
  </div>
  <div class="progress-bar-container progress">
    <% percentage = 40 %>
    <div class="progress-bar"
         role="progressbar"
         aria-valuenow="<%= percentage %>%"
         aria-valuemin="0"
         aria-valuemax="100"
         style="width:<%= percentage %>%; min-width: 2em;">
    </div>
  </div>
  <div class="description-cell table-cell">
    <%= link_to 'Experiment Accesss', edit_access_permissions_project_experiment_path(project, experiment), remote: true, data: { action: 'remote-modal'} %>
    <%= link_to 'Show Experiment Accesss', access_permissions_project_experiment_path(project, experiment), remote: true, data: { action: 'remote-modal'} %>
    <div class="description-text">
      <%= custom_auto_link(experiment.description, team: current_team) %>
    </div>
    <%= link_to t('experiments.card.more'),
          experiment_path(experiment),
          class: 'more-button',
          remote: true %>

  </div>
</div>