Start builds redesign

app/assets/stylesheets/framework/blocks.scss

@@ -18,7 +18,7 @@
   line-height: 36px;
 }
-.gray-content-block {
+.row-content-block {
   margin-top: 0;
   margin-bottom: -$gl-padding;
   background-color: $background-color;
@@ -81,6 +81,11 @@
       margin-left: 10px;
     }
   }
+
+  &.build-content {
+    background-color: $white-light;
+    border-top: none;
+  }
 }
 .cover-block {
@@ -113,7 +118,7 @@
     line-height: 1.1;
     h1 {
-      color: #313236;
+      color: $gl-gray-dark;
       margin-bottom: 6px;
       font-size: 23px;
     }

app/assets/stylesheets/framework/buttons.scss

@@ -59,7 +59,7 @@
 }
 @mixin btn-gray {
-  @include btn-color($gray-light, $border-gray-light, $gray-normal, $border-gray-light, $gray-dark, $border-gray-dark, #313236);
+  @include btn-color($gray-light, $border-gray-light, $gray-normal, $border-gray-light, $gray-dark, $border-gray-dark, $gl-gray-dark);
 }
 @mixin btn-white {

app/assets/stylesheets/framework/tw_bootstrap.scss

@@ -81,7 +81,7 @@
 // Labels
 .label {
-  padding: 2px 4px;
+  padding: 4px 5px;
   font-size: 13px;
   font-style: normal;
   font-weight: normal;

app/assets/stylesheets/framework/typography.scss

@@ -42,14 +42,14 @@
     margin: 24px 0 12px;
     padding: 0 0 10px;
     border-bottom: 1px solid #e7e9ed;
-    color: #313236;
+    color: $gl-gray-dark;
   }
   h2 {
     font-size: 1.2em;
     font-weight: 600;
     margin: 24px 0 12px;
-    color: #313236;
+    color: $gl-gray-dark;
   }
   h3 {

app/assets/stylesheets/framework/variables.scss

@@ -20,7 +20,7 @@ $background-color:   #fafafa;
  */
 $gl-font-size:         15px;
 $gl-title-color:       #333;
-$gl-text-color:        #555;
+$gl-text-color:        #5c5c5c;
 $gl-text-green:        #4a2;
 $gl-text-red:          #d12f19;
 $gl-text-orange:       #d90;
@@ -30,6 +30,7 @@ $gl-placeholder-color: #8f8f8f;
 $gl-icon-color:        $gl-placeholder-color;
 $gl-grayish-blue:      #7f8fa4;
 $gl-gray:              $gl-text-color;
+$gl-gray-dark:         #313236;
 $gl-header-color:      $gl-title-color;
 /*

app/assets/stylesheets/pages/commit.scss

@@ -31,9 +31,17 @@
   }
   .commit-committer-link,
   .commit-author-link {
-    color: #444;
+    color: $gl-gray;
     font-weight: bold;
   }
+
+  .ci-status {
+    margin-right: 10px;
+  }
+
+  .fa-clipboard {
+    color: $dropdown-title-btn-color;
+  }
 }
 .commit-box {
@@ -42,7 +50,7 @@
   .commit-title {
     margin: 0;
     font-size: 23px;
-    color: #313236;
+    color: $gl-gray-dark;
   }
   .commit-description {

app/assets/stylesheets/pages/detail_page.scss

@@ -22,7 +22,7 @@
   .title {
     margin: 0;
     font-size: 23px;
-    color: #313236;
+    color: $gl-gray-dark;
   }
   .description {

app/assets/stylesheets/pages/merge_requests.scss

@@ -104,7 +104,7 @@
       font-weight: 600;
       font-size: 17px;
       margin: 5px 0;
-      color: #313236;
+      color: $gl-gray-dark;
     }
     p:last-child {
@@ -136,7 +136,7 @@
 }
 .label-branch {
-  color: #313236;
+  color: $gl-gray-dark;
   font-family: $monospace_font;
   font-weight: bold;
   overflow: hidden;
@@ -272,3 +272,19 @@
   display: inline-block;
   width: 250px;
 }
+
+.table-holder {
+  .builds {
+
+    th {
+      background-color: $white-light;
+      color: $gl-placeholder-color;
+    }
+
+    th,
+    td {
+      padding: 16px;
+    }
+  }
+}
+

app/assets/stylesheets/pages/projects.scss

@@ -178,7 +178,7 @@
     .option-title {
       font-weight: normal;
       display: inline-block;
-      color: #313236;
+      color: $gl-gray-dark;
     }
     .option-descr {

app/views/admin/builds/_build.html.haml

@@ -35,15 +35,15 @@
   %td
     #{build.stage} / #{build.name}
-    .pull-right
-      - 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
+  %td
+    - 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
   %td.duration
     - if build.duration
@@ -69,4 +69,4 @@
             %i.fa.fa-remove.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' do
-            %i.fa.fa-repeat
+            %i.fa.fa-refresh

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

@@ -19,7 +19,7 @@
     - if @all_builds.running_or_pending.any?
       = link_to 'Cancel all', cancel_all_admin_builds_path, data: { confirm: 'Are you sure?' }, class: 'btn btn-danger', method: :post
-.gray-content-block.second-block
+.row-content-block.second-block
   #{(@scope || 'running').capitalize} builds
 %ul.content-list
@@ -38,6 +38,7 @@
             %th Ref
             %th Runner
             %th Name
+            %th Tags
             %th Duration
             %th Finished at
             %th

app/views/admin/logs/show.html.haml

@@ -7,7 +7,7 @@
     %li{ class: (klass == Gitlab::GitLogger ? 'active' : '') }
       = link_to klass::file_name, "##{klass::file_name_noext}",
           'data-toggle' => 'tab'
-.gray-content-block
+.row-content-block
   To prevent performance issues admin logs output the last 2000 lines
 .tab-content
   - loggers.each do |klass|

app/views/admin/users/index.html.haml

@@ -32,7 +32,7 @@
         Without projects
         %small.badge= number_with_delimiter(User.without_projects.count)
-  .gray-content-block.second-block
+  .row-content-block.second-block
     .pull-right
       .dropdown.inline
         %a.dropdown-toggle.btn{href: '#', "data-toggle" => "dropdown"}

app/views/dashboard/todos/index.html.haml

@@ -25,7 +25,7 @@
         = icon('spinner spin')
 .todos-filters
-  .gray-content-block.second-block
+  .row-content-block.second-block
     = form_tag todos_filter_path(without: [:project_id, :author_id, :type, :action_id]), method: :get, class: 'filter-form' do
       .filter-item.inline
         = select_tag('project_id', todo_projects_options,

app/views/events/_event_last_push.html.haml

 - if show_last_push_widget?(event)
-  .gray-content-block.clear-block.last-push-widget
+  .row-content-block.clear-block.last-push-widget
     .event-last-push
       .event-last-push-text
         %span You pushed to

app/views/explore/groups/index.html.haml

@@ -6,7 +6,7 @@
 - else
   = render 'explore/head'
-.gray-content-block.clearfix
+.row-content-block.clearfix
   .pull-left
     = form_tag explore_groups_path, method: :get, class: 'form-inline form-tiny' do |f|
       = hidden_field_tag :sort, @sort

app/views/explore/snippets/index.html.haml

@@ -6,7 +6,7 @@
 - else
   = render 'explore/head'
-.gray-content-block
+.row-content-block
   - if current_user
     .pull-right
       = link_to new_snippet_path, class: "btn btn-new", title: "New Snippet" do

app/views/groups/issues.html.haml

@@ -16,7 +16,7 @@
 = render 'shared/issuable/filter', type: :issues
-.gray-content-block.second-block
+.row-content-block.second-block
   Only issues from
   %strong #{@group.name}
   group are listed here.

app/views/groups/merge_requests.html.haml

@@ -8,7 +8,7 @@
 = render 'shared/issuable/filter', type: :merge_requests
-.gray-content-block.second-block
+.row-content-block.second-block
   Only merge requests from
   %strong #{@group.name}
   group are listed here.

app/views/groups/milestones/index.html.haml

@@ -10,7 +10,7 @@
         = icon('plus')
         New Milestone
-.gray-content-block
+.row-content-block
   Only milestones from
   %strong #{@group.name}
   group are listed here.