Update builds page

app/assets/stylesheets/pages/pipelines.scss

@@ -7,10 +7,6 @@
     white-space: nowrap;
   }
 
-  .duration, .finished-at {
-    margin: 4px 0;
-  }
-
   .commit-title {
     margin: 0;
   }
@@ -24,9 +20,13 @@
   }
 }
 
-.content-list.pipelines {
-  width: 100%;
-  overflow: auto;
+.content-list {
+
+  &.pipelines,
+  &.builds-content-list {
+    width: 100%;
+    overflow: auto;
+  }
 }
 
 .table.builds {
@@ -76,11 +76,16 @@
     .avatar {
       margin-left: 0;
     }
+
+    .label-container {
+      margin-top: 5px;
+    }
   }
 
   .duration,
   .finished-at {
     color: $table-text-gray;
+    margin: 4px 0;
 
     .fa {
       margin-right: 5px;
@@ -91,10 +96,11 @@
 
     .btn {
       margin: 0;
+      color: $table-text-gray;
     }
 
     .dropdown-toggle,
-    .dropdown-menu  {
+    .dropdown-menu {
       color: $table-text-gray;
 
       .fa {
@@ -113,9 +119,6 @@
         .btn-default {
           background-color: $white-normal;
           border-color: $border-white-normal;
-
-          &:hover {
-          }
         }
       }
     }

app/views/projects/builds/index.html.haml

@@ -36,7 +36,7 @@
         = link_to ci_lint_path, class: 'btn btn-default' do
           %span CI Lint
 
-  %ul.content-list
+  %ul.content-list.builds-content-list
     - if @builds.blank?
       %li
         .nothing-here-block No builds to show
@@ -46,14 +46,10 @@
           %thead
             %tr
               %th Status
-              %th Build ID
               %th Commit
-              %th Ref
               %th Stage
               %th Name
-              %th Tags
-              %th Duration
-              %th Finished at
+              %th
               - if @project.build_coverage_enabled?
                 %th Coverage
               %th

app/views/projects/ci/builds/_build.html.haml

-%tr.build
+%tr.build.commit
   %td.status
     - if can?(current_user, :read_build, build)
       = ci_status_with_icon(build.status, namespace_project_build_url(build.project.namespace, build.project, build))
     - else
       = ci_status_with_icon(build.status)
 
-  %td.build-link
-    - if can?(current_user, :read_build, build)
-      = link_to namespace_project_build_url(build.project.namespace, build.project, build) do
-        %strong ##{build.id}
-    - else
-      %strong ##{build.id}
+  %td
+    %div.branch-commit
+      - if can?(current_user, :read_build, build)
+        = link_to namespace_project_build_url(build.project.namespace, build.project, build) do
+          %span ##{build.id}
+      - else
+        %span ##{build.id}
 
-    - if build.stuck?
-      = icon('warning', class: 'text-warning has-tooltip', title: 'Build is stuck. Check runners.')
-    - if defined?(retried) && retried
-      = icon('warning', class: 'text-warning has-tooltip', title: 'Build was retried.')
+      - if build.stuck?
+        = icon('warning', class: 'text-warning has-tooltip', title: 'Build is stuck. Check runners.')
+      - if defined?(retried) && retried
+        = icon('warning', class: 'text-warning has-tooltip', title: 'Build was retried.')
 
-  - if defined?(commit_sha) && commit_sha
-    %td
-      = link_to build.short_sha, namespace_project_commit_path(build.project.namespace, build.project, build.sha), class: "monospace"
+      - if defined?(ref) && ref
+        - if build.ref
+          = link_to build.ref, namespace_project_commits_path(build.project.namespace, build.project, build.ref), class: "monospace branch-name"
+        - else
+          .light none
+        = icon("code-fork")
+
+      - if defined?(commit_sha) && commit_sha
+        = link_to build.short_sha, namespace_project_commit_path(build.project.namespace, build.project, build.sha), class: "commit-id monospace"
+
+      .label-container
+        - if build.tags.any?
+          - build.tags.each do |tag|
+            %span.label.label-primary
+              = tag
+        - if build.try(:trigger_request)
+          %span.label.label-info triggered
+        - if build.try(:allow_failure)
+          %span.label.label-danger allowed to fail
+        - if defined?(retried) && retried
+          %span.label.label-warning retried
 
-  - if defined?(ref) && ref
-    %td
-      - if build.ref
-        = link_to build.ref, namespace_project_commits_path(build.project.namespace, build.project, build.ref)
-      - else
-        .light none
 
   - if defined?(runner) && runner
     %td
@@ -43,27 +56,14 @@
     = build.name
 
   %td
-    .label-container
-      - if build.tags.any?
-        - build.tags.each do |tag|
-          %span.label.label-primary
-            = tag
-      - if build.try(:trigger_request)
-        %span.label.label-info triggered
-      - if build.try(:allow_failure)
-        %span.label.label-danger allowed to fail
-      - if defined?(retried) && retried
-        %span.label.label-warning retried
-
-  %td.duration
     - if build.duration
-      = icon("clock-o")
-      #{duration_in_words(build.finished_at, build.started_at)}
-
-  %td.timestamp
+      %p.duration
+        = icon("clock-o")
+        #{duration_in_words(build.finished_at, build.started_at)}
     - if build.finished_at
-      = icon("calendar")
-      %span #{time_ago_with_tooltip(build.finished_at)}
+      %p.finished-at
+        = icon("calendar")
+        %span #{time_ago_with_tooltip(build.finished_at)}
 
   - if defined?(coverage) && coverage
     %td.coverage
@@ -81,4 +81,4 @@
             = icon('remove', class: 'cred')
         - elsif defined?(allow_retry) && allow_retry && build.retryable?
           = link_to retry_namespace_project_build_path(build.project.namespace, build.project, build, return_to: request.original_url), method: :post, title: 'Retry', class: 'btn btn-build' do
-            = icon('refresh')
+            = icon('repeat')