move progress bar from milestone summary into the sidebar

6 files changed, 35 insertions, 57 deletions

diff --git a/app/assets/stylesheets/pages/milestone.scss b/app/assets/stylesheets/pages/milestone.scss
index ce3adbb9114..e700637d4f5 100644
--- a/app/assets/stylesheets/pages/milestone.scss
+++ b/app/assets/stylesheets/pages/milestone.scss
@@ -53,6 +53,21 @@
 }
 
 .milestone-sidebar {
+  .gutter-toggle {
+    margin-bottom: 10px;
+  }
+
+  .milestone-progress {
+    .title {
+      padding-top: 5px;
+    }
+
+    .progress {
+      height: 6px;
+      margin: 0;
+    }
+  }
+
   .remaining-days strong {
     font-weight: normal;
   }
@@ -67,50 +82,22 @@
     margin-right: 0;
   }
 
-  .right-sidebar-collapsed & {
-    .reference {
-      border-top: 1px solid $border-gray-normal;
-    }
-  }
-}
-
-.milestone-summary {
-  .milestone-stat {
-    white-space: nowrap;
-    margin-right: 10px;
-
-    &.with-drilldown {
-      margin-right: 2px;
-    }
-  }
-
-  .milestone-stats-and-buttons {
-    display: flex;
-    justify-content: flex-start;
-    flex-wrap: wrap;
+  .milestone-progress {
+    .sidebar-collapsed-icon {
+      clear: both;
+      padding: 15px 5px 5px;
 
-    @media (min-width: $screen-xs-min) {
-      justify-content: space-between;
-      flex-wrap: nowrap;
+      .progress {
+        margin: 5px 0;
+      }
     }
   }
 
-  .milestone-stats {
-    order: 2;
-    width: 100%;
-    padding: 7px 0;
-    flex-shrink: 1;
-
-    @media (min-width: $screen-xs-min) {
-      // when displayed on one line stats go first, buttons second
-      order: 1;
+  .right-sidebar-collapsed & {
+    .reference {
+      border-top: 1px solid $border-gray-normal;
     }
   }
-
-  .progress {
-    width: 100%;
-    margin: 15px 0;
-  }
 }
 
 .issues-sortable-list,
diff --git a/app/views/dashboard/milestones/show.html.haml b/app/views/dashboard/milestones/show.html.haml
index 7a65dd4114d..2129920afd2 100644
--- a/app/views/dashboard/milestones/show.html.haml
+++ b/app/views/dashboard/milestones/show.html.haml
@@ -1,6 +1,5 @@
 - header_title "Milestones", dashboard_milestones_path
 
 = render 'shared/milestones/top', milestone: @milestone
-= render 'shared/milestones/summary', milestone: @milestone
 = render 'shared/milestones/tabs', milestone: @milestone, show_full_project_name: true
 = render 'shared/milestones/sidebar', milestone: @milestone, affix_offset: 51
diff --git a/app/views/groups/milestones/show.html.haml b/app/views/groups/milestones/show.html.haml
index ddc1a845e5a..8e83b2002b2 100644
--- a/app/views/groups/milestones/show.html.haml
+++ b/app/views/groups/milestones/show.html.haml
@@ -4,6 +4,5 @@
   = page_specific_javascript_bundle_tag('simulate_drag') if Rails.env.test?
 
 = render 'shared/milestones/top', milestone: @milestone, group: @group
-= render 'shared/milestones/summary', milestone: @milestone
 = render 'shared/milestones/tabs', milestone: @milestone, show_project_name: true
 = render 'shared/milestones/sidebar', milestone: @milestone, affix_offset: 102
diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index 7299f6046f4..f612b5c7d6b 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -56,6 +56,5 @@
     .alert.alert-success.prepend-top-default
       %span All issues for this milestone are closed. You may close this milestone now.
 
-  = render 'shared/milestones/summary', milestone: @milestone, project: @project
   = render 'shared/milestones/tabs', milestone: @milestone
   = render 'shared/milestones/sidebar', milestone: @milestone, project: @project, affix_offset: 153
diff --git a/app/views/shared/milestones/_sidebar.html.haml b/app/views/shared/milestones/_sidebar.html.haml
index bb406316662..38ff9c7a92d 100644
--- a/app/views/shared/milestones/_sidebar.html.haml
+++ b/app/views/shared/milestones/_sidebar.html.haml
@@ -3,12 +3,19 @@
 
 %aside.right-sidebar.js-right-sidebar{ data: { "offset-top" => affix_offset, "spy" => "affix" }, class: sidebar_gutter_collapsed_class, 'aria-live' => 'polite' }
   .issuable-sidebar.milestone-sidebar
-    .block.issuable-sidebar-header
+    .block.milestone-progress.issuable-sidebar-header
       %a.gutter-toggle.pull-right.js-sidebar-toggle{ role: "button", href: "#", "aria-label" => "Toggle sidebar" }
         = sidebar_gutter_toggle_icon
 
-      %span.issuable-header-text.hide-collapsed
-        Milestone #{milestone.try(:to_reference) || milestone.title}
+      .sidebar-collapsed-icon
+        %span== #{milestone.percent_complete(current_user)}%
+        = milestone_progress_bar(milestone)
+      .title.hide-collapsed
+        %strong== #{milestone.percent_complete(current_user)}%
+        %span.hide-collapsed
+          complete
+      .value.hide-collapsed
+        = milestone_progress_bar(milestone)
 
     - if project
       .block.due_date
diff --git a/app/views/shared/milestones/_summary.html.haml b/app/views/shared/milestones/_summary.html.haml
deleted file mode 100644
index 9c08dd5f5fe..00000000000
--- a/app/views/shared/milestones/_summary.html.haml
+++ /dev/null
@@ -1,13 +0,0 @@
-- project = local_assigns[:project]
-
-.context.prepend-top-default
-  .milestone-summary
-    %h4 Progress
-
-    .milestone-stats-and-buttons
-      .milestone-stats
-        %span.milestone-stat
-          %strong== #{milestone.percent_complete(current_user)}%
-          complete
-
-    = milestone_progress_bar(milestone)