Show badges in Milestone tabs and padding in Milestone list (both to match Issues page)

app/assets/stylesheets/pages/milestone.scss

@@ -2,13 +2,17 @@
   max-width: 90%;
 }
 
-li.milestone {
-  h4 {
-    font-weight: bold;
-  }
+.milestones {
+  .milestone {
+    padding: 10px 16px;
+
+    h4 {
+      font-weight: bold;
+    }
 
-  .progress {
-    height: 6px;
+    .progress {
+      height: 6px;
+    }
   }
 }
 

app/helpers/milestones_helper.rb

@@ -35,6 +35,19 @@ module MilestonesHelper
     milestone.issues.with_label(label.title).send(state).size
   end
 
+  def milestone_count_by_state(project, state)
+    if project.nil?
+      nil
+    else
+      case state
+      when 'all' then @project.milestones.size
+      when 'closed' then @project.milestones.closed.size
+      when 'opened' then @project.milestones.active.size
+      else nil
+      end
+    end
+  end
+
   def milestone_progress_bar(milestone)
     options = {
       class: 'progress-bar progress-bar-success',

app/views/shared/_milestones_filter.html.haml

@@ -2,9 +2,12 @@
   %li{class: ("active" if params[:state].blank? || params[:state] == 'opened')}
     = link_to milestones_filter_path(state: 'opened') do
       Open
+      %span.badge #{milestone_count_by_state(@project, 'opened')}
   %li{class: ("active" if params[:state] == 'closed')}
     = link_to milestones_filter_path(state: 'closed') do
       Closed
+      %span.badge #{milestone_count_by_state(@project, 'closed')}
   %li{class: ("active" if params[:state] == 'all')}
     = link_to milestones_filter_path(state: 'all') do
       All
+      %span.badge #{milestone_count_by_state(@project, 'all')}