1 files changed, 15 insertions, 13 deletions
diff --git a/app/views/projects/cycle_analytics/show.html.haml b/app/views/projects/cycle_analytics/show.html.haml
index 5dcb2a17873..7f346df8797 100644
--- a/app/views/projects/cycle_analytics/show.html.haml
+++ b/app/views/projects/cycle_analytics/show.html.haml
@@ -2,18 +2,20 @@
 - page_title "Cycle Analytics"
 = render "projects/pipelines/head"
 
-#cycle-analytics{"v-cloak" => "true", data: { request_path: project_cycle_analytics_path(@project)}}
+#cycle-analytics{class: container_class, "v-cloak" => "true", data: { request_path: project_cycle_analytics_path(@project)}}
 
   .bordered-box.landing.content-block{"v-if" => "!isHelpDismissed"}
     = icon('times', class: 'dismiss-icon', "@click": "dismissLanding()")
-    = custom_icon('icon_cycle_analytics_splash')
-    .inner-content
-      %h4
-        Introducing Cycle Analytics
-      %p
-        Cycle Analytics gives an overview of how much time it takes to go from idea to production in your project.
+    .row
+      .col-sm-3.col-xs-12.svg-container
+        = custom_icon('icon_cycle_analytics_splash')
+      .col-sm-8.col-xs-12.inner-content
+        %h4
+          Introducing Cycle Analytics
+        %p
+          Cycle Analytics gives an overview of how much time it takes to go from idea to production in your project.
 
-      = link_to "Read more",  help_page_path('user/project/cycle_analytics'), target: '_blank', class: 'btn'
+        = link_to "Read more",  help_page_path('user/project/cycle_analytics'), target: '_blank', class: 'btn'
 
   = icon("spinner spin", "v-show" => "isLoading")
 
@@ -25,11 +27,11 @@
       .content-block
         .container-fluid
           .row
-            .col-xs-3.column{"v-for" => "item in summary"}
+            .col-sm-3.col-xs-12.column{"v-for" => "item in analytics.summary"}
               %h3.header {{item.value}}
               %p.text {{item.title}}
 
-            .col-xs-3.column
+            .col-sm-3.col-xs-12.column
               .dropdown.inline.js-ca-dropdown
                 %button.dropdown-menu-toggle{"data-toggle" => "dropdown", :type => "button"}
                   %span.dropdown-label Last 30 days
@@ -44,14 +46,14 @@
 
     .bordered-box
       %ul.content-list
-        %li{"v-for" => "item in stats"}
+        %li{"v-for" => "item in analytics.stats"}
           .container-fluid
             .row
-              .col-xs-10.title-col
+              .col-xs-8.title-col
                 %p.title
                   {{item.title}}
                 %p.text
                   {{item.description}}
-              .col-xs-2.value-col
+              .col-xs-4.value-col
                 %span
                   {{item.value}}