.gl-responsive-table-row.deployment{ role: 'row' }
  .table-section.section-10{ role: 'gridcell' }
    .table-mobile-header{ role: 'rowheader' } ID
    %strong.table-mobile-content ##{deployment.iid}

  .table-section.section-30{ role: 'gridcell' }
    .table-mobile-header{ role: 'rowheader' } Commit
    = render 'projects/deployments/commit', deployment: deployment

  .table-section.section-25.build-column{ role: 'gridcell' }
    .table-mobile-header{ role: 'rowheader' } Job
    - if deployment.deployable
      .table-mobile-content
        .flex-truncate-parent
          .flex-truncate-child
            = link_to [@project.namespace.becomes(Namespace), @project, deployment.deployable], class: 'build-link' do
              #{deployment.deployable.name} (##{deployment.deployable.id})
        - if deployment.user
          %div
            by
            = user_avatar(user: deployment.user, size: 20)

  .table-section.section-15{ role: 'gridcell' }
    .table-mobile-header{ role: 'rowheader' } Created
    %span.table-mobile-content= time_ago_with_tooltip(deployment.created_at)

  .table-section.section-20.table-button-footer{ role: 'gridcell' }
    .btn-group.table-action-buttons
      = render 'projects/deployments/actions', deployment: deployment
      = render 'projects/deployments/rollback', deployment: deployment