Merge branch '18934-compare-gray-block' into 'master'

Update gray block under subnav to match other pages

## What does this MR do?
Makes Compare sub nav full width; replaces gray block with white one to match rest of pages

## What are the relevant issue numbers?
Closes #18934 

## Screenshots (if relevant)
![Screen_Shot_2016-06-21_at_1.14.46_PM](/uploads/43377efe7816b854f48966bcbd96a1cc/Screen_Shot_2016-06-21_at_1.14.46_PM.png)

cc @dzaporozhets 

See merge request !4838

3 files changed, 35 insertions, 19 deletions

diff --git a/app/assets/stylesheets/framework/blocks.scss b/app/assets/stylesheets/framework/blocks.scss
index d5fe5bc2ef1..38023818709 100644
--- a/app/assets/stylesheets/framework/blocks.scss
+++ b/app/assets/stylesheets/framework/blocks.scss
@@ -97,6 +97,22 @@
   }
 }
 
+.sub-header-block {
+  background-color: $white-light;
+  border-bottom: 1px solid $white-dark;
+  padding: 11px 0;
+  margin-bottom: 11px;
+
+  .oneline {
+    line-height: 35px;
+  }
+
+  &.no-bottom-space {
+    border-bottom: 0;
+    margin-bottom: 0;
+  }
+}
+
 .cover-block {
   text-align: center;
   background: $background-color;
diff --git a/app/views/projects/compare/index.html.haml b/app/views/projects/compare/index.html.haml
index c322942aeba..b22285c11e0 100644
--- a/app/views/projects/compare/index.html.haml
+++ b/app/views/projects/compare/index.html.haml
@@ -3,7 +3,7 @@
 = render "projects/commits/head"
 
 %div{ class: (container_class) }
-  .row-content-block.second-block.content-component-block
+  .sub-header-block
     Compare branches, tags or commit ranges.
     %br
     Fill input field with commit id like
diff --git a/app/views/projects/compare/show.html.haml b/app/views/projects/compare/show.html.haml
index cdc34f51d6d..f4ec7b767f6 100644
--- a/app/views/projects/compare/show.html.haml
+++ b/app/views/projects/compare/show.html.haml
@@ -1,24 +1,24 @@
+- @no_container = true
 - page_title "#{params[:from]}...#{params[:to]}"
 = render "projects/commits/head"
 
+%div{ class: (container_class) }
+  .sub-header-block.no-bottom-space
+    = render "form"
 
-.row-content-block
-  = render "form"
-
-- if @commits.present?
-  .prepend-top-default
+  - if @commits.present?
     = render "projects/commits/commit_list"
     = render "projects/diffs/diffs", diffs: @diffs, project: @project, diff_refs: @diff_refs
-- else
-  .light-well.prepend-top-default
-    .center
-      %h4
-        There isn't anything to compare.
-      %p.slead
-        - if params[:to] == params[:from]
-          %span.label-branch #{params[:from]}
-          and
-          %span.label-branch #{params[:to]}
-          are the same.
-        - else
-          You'll need to use different branch names to get a valid comparison.
+  - else
+    .light-well
+      .center
+        %h4
+          There isn't anything to compare.
+        %p.slead
+          - if params[:to] == params[:from]
+            %span.label-branch #{params[:from]}
+            and
+            %span.label-branch #{params[:to]}
+            are the same.
+          - else
+            You'll need to use different branch names to get a valid comparison.