Start builds redesign

9 files changed, 43 insertions, 13 deletions

diff --git a/app/assets/stylesheets/framework/blocks.scss b/app/assets/stylesheets/framework/blocks.scss
index e72e4aa47ef..af6f22da281 100644
--- a/app/assets/stylesheets/framework/blocks.scss
+++ b/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;
     }
diff --git a/app/assets/stylesheets/framework/buttons.scss b/app/assets/stylesheets/framework/buttons.scss
index 062da397b6b..edb5ee71f98 100644
--- a/app/assets/stylesheets/framework/buttons.scss
+++ b/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 {
diff --git a/app/assets/stylesheets/framework/tw_bootstrap.scss b/app/assets/stylesheets/framework/tw_bootstrap.scss
index 96bab7880c2..6a45c34ccbb 100644
--- a/app/assets/stylesheets/framework/tw_bootstrap.scss
+++ b/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;
diff --git a/app/assets/stylesheets/framework/typography.scss b/app/assets/stylesheets/framework/typography.scss
index b2535ddf4bd..2779cd56788 100644
--- a/app/assets/stylesheets/framework/typography.scss
+++ b/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 {
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index 92ecfe50488..4227839eed3 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/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;
 
 /*
diff --git a/app/assets/stylesheets/pages/commit.scss b/app/assets/stylesheets/pages/commit.scss
index 358d2f4ab9d..5c945e2d4c9 100644
--- a/app/assets/stylesheets/pages/commit.scss
+++ b/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 {
diff --git a/app/assets/stylesheets/pages/detail_page.scss b/app/assets/stylesheets/pages/detail_page.scss
index 3438dbe4958..5e61e61d85c 100644
--- a/app/assets/stylesheets/pages/detail_page.scss
+++ b/app/assets/stylesheets/pages/detail_page.scss
@@ -22,7 +22,7 @@
   .title {
     margin: 0;
     font-size: 23px;
-    color: #313236;
+    color: $gl-gray-dark;
   }
 
   .description {
diff --git a/app/assets/stylesheets/pages/merge_requests.scss b/app/assets/stylesheets/pages/merge_requests.scss
index 4ef548ffbe7..c4005ba1e69 100644
--- a/app/assets/stylesheets/pages/merge_requests.scss
+++ b/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;
+    }
+  }
+}
+
diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss
index 99108e9bfc4..c20f04653fc 100644
--- a/app/assets/stylesheets/pages/projects.scss
+++ b/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 {