scinote-web/app/views/projects/index/_project_card.html.erb

<div class="card project-card"
     data-id="<%= project.id %>"
     data-edit-url="<%= edit_project_path(project) %>"
     data-permissions-url="<%= permissions_project_path(project) %>">
  <div class="checkbox-cell table-cell">
    <div class="sci-checkbox-container">
      <input value="1" type="checkbox" class="sci-checkbox project-card-selector">
      <span class="sci-checkbox-label"></span>
    </div>
  </div>

  <div class="project-code-cell table-cell">
    <span><%= project.code %></span>
  </div>

  <div class="project-name-cell table-cell">
    <%
      disabled_link = 'disabled-link' unless can_read_project?(project)
    %>
    <% if project.archived? %>
      <%= link_to project_url(project, view_mode: :archived), class: disabled_link  do %>
        <h3 class="name" title="<%= project.name %>">
          <%= project.name %>
        </h3>
      <% end %>
    <% else %>
      <%= link_to project_url(project), class: disabled_link do %>
        <h3 class="name" title="<%= project.name %>">
          <%= project.name %>
        </h3>
      <% end %>
    <% end %>
  </div>

  <div class="actions actions-cell table-cell">
    <div
      class="dropdown dropdown-async project-actions-menu  <%= 'new-comments' if has_unseen_comments?(project) %>"
      data-dropdown-url="<%= actions_dropdown_project_path(project) %>">
      <button class="btn btn-light btn-xs dropdown-toggle icon-btn" type="button" id="projectActionsDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
        <i class="sn-icon sn-icon-more-hori"></i>
      </button>
      <ul></ul>
    </div>
  </div>

  <div class="data-row start-date-cell table-cell">
    <span class="card-label"><%= t('projects.index.card.start_date') %></span>
    <span class="value card-value"> <%= l(project.created_at, format: :full_date) %></span>
    <span class="value cell-value"> <%= l(project.created_at, format: :full_with_comma) %></span>
  </div>

  <% if project.archived? %>
    <div class="data-row archived-date-cell table-cell">
      <span class="card-label"><%= t('projects.index.card.archived_date') %></span>
      <span class="value card-value"> <%= l(project.archived_on, format: :full_date) %></span>
      <span class="value cell-value"> <%= l(project.archived_on, format: :full_with_comma) %></span>
    </div>
  <% end %>

  <div class="data-row visibility-cell table-cell">
    <span class="card-label"><%= t('projects.index.card.visibility') %></span>
    <span class="value">
    <% if project.hidden? %>
      <%= t('projects.index.hidden') %>
    <% else %>
      <%= t('projects.index.visible') %>
    <% end %>
    </span>
  </div>

  <div class="data-row user-cell table-cell">
    <span class="card-label"><%= t('projects.index.card.users') %></span>
    <div class="value">
      <% if can_manage_project_users?(project) %>
        <%= link_to edit_access_permissions_project_path(project), class: 'project-users-link', data: { action: 'remote-modal' } do %>
          <%= render partial: 'projects/index/users_list', locals: { project: project } %>
          <span class="new-user global-avatar-container">
            <i class="sn-icon sn-icon-new-task"></i>
          </span>
        <% end %>
      <% else %>
        <%= link_to access_permissions_project_path(project), class: 'project-users-link', data: { action: 'remote-modal' } do %>
          <%= render partial: 'projects/index/users_list', locals: { project: project } %>
        <% end %>
      <% end %>
    </div>
  </div>
</div>