From 365d96ca850caf653f48a611f4a6dd785487e526 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Mon, 25 Jan 2016 12:07:04 -0500
Subject: [PATCH 01/17] Add labels tab to milestone detail view.

---
 app/assets/stylesheets/pages/labels.scss          |  4 ++++
 app/controllers/projects/milestones_controller.rb |  1 +
 app/models/label.rb                               |  4 ++++
 app/models/milestone.rb                           |  1 +
 app/views/projects/milestones/show.html.haml      | 13 +++++++++++++
 5 files changed, 23 insertions(+)

diff --git a/app/assets/stylesheets/pages/labels.scss b/app/assets/stylesheets/pages/labels.scss
index d1590e42fcb..0bc72f30cc3 100644
--- a/app/assets/stylesheets/pages/labels.scss
+++ b/app/assets/stylesheets/pages/labels.scss
@@ -19,3 +19,7 @@
 .color-label {
   padding: 3px 4px;
 }
+
+#tab-labels .issues-count {
+  margin-left: 30px;
+}
diff --git a/app/controllers/projects/milestones_controller.rb b/app/controllers/projects/milestones_controller.rb
index 15506bd677a..a9912764919 100644
--- a/app/controllers/projects/milestones_controller.rb
+++ b/app/controllers/projects/milestones_controller.rb
@@ -34,6 +34,7 @@ class Projects::MilestonesController < Projects::ApplicationController
     @issues = @milestone.issues
     @users = @milestone.participants.uniq
     @merge_requests = @milestone.merge_requests
+    @labels = @milestone.labels
   end
 
   def create
diff --git a/app/models/label.rb b/app/models/label.rb
index 220da10a6ab..f93ce7e1c89 100644
--- a/app/models/label.rb
+++ b/app/models/label.rb
@@ -85,6 +85,10 @@ class Label < ActiveRecord::Base
     issues.opened.count
   end
 
+  def closed_issues_count
+    issues.closed.count
+  end
+
   def template?
     template
   end
diff --git a/app/models/milestone.rb b/app/models/milestone.rb
index c9a0ad8b9b6..7dba17726c0 100644
--- a/app/models/milestone.rb
+++ b/app/models/milestone.rb
@@ -27,6 +27,7 @@ class Milestone < ActiveRecord::Base
 
   belongs_to :project
   has_many :issues
+  has_many :labels, through: :issues
   has_many :merge_requests
   has_many :participants, through: :issues, source: :assignee
 
diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index 528a4f9552f..a6108afd8e7 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -70,6 +70,10 @@
     = link_to '#tab-participants', 'data-toggle' => 'tab' do
       Participants
       %span.badge= @users.count
+  %li
+    = link_to '#tab-labels', 'data-toggle' => 'tab' do
+      Labels
+      %span.badge= @labels.count
 
 .tab-content
   .tab-pane.active#tab-issues
@@ -128,3 +132,12 @@
             %strong= truncate(user.name, lenght: 40)
             %br
             %small.cgray= user.username
+
+  .tab-pane#tab-labels
+    %ul.bordered-list.manage-labels-list
+      - @labels.each do |label|
+        %li
+          = render_colored_label(label)
+          .pull-right
+            %span.issues-count= pluralize label.open_issues_count, 'open issue'
+            %span.issues-count= pluralize label.closed_issues_count, 'closed issue'

From 4e8266e8df3a5a66a2622e4c5e1ee902cf3a66b5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Mon, 25 Jan 2016 12:21:25 -0500
Subject: [PATCH 02/17] Change format of Milestone stats.

---
 app/views/projects/milestones/show.html.haml | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index a6108afd8e7..72a4164d2d4 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -48,12 +48,15 @@
 
 .context.prepend-top-default
   %p.lead
-    Progress:
-    #{@milestone.closed_items_count} closed
-    &ndash;
-    #{@milestone.open_items_count} open
-    &nbsp;
-    %span.light #{@milestone.percent_complete}% complete
+    %h4 Progress
+    %strong= @milestone.issues.count
+    issues:
+    %strong= @milestone.open_items_count
+    open and
+    %strong= @milestone.closed_items_count
+    closed
+    %strong== #{@milestone.percent_complete}%
+    complete
     %span.pull-right= @milestone.expires_at
   = milestone_progress_bar(@milestone)
 

From 1162f8d77eda707269ce3214ade25bf1c64d304b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Tue, 26 Jan 2016 10:58:04 -0500
Subject: [PATCH 03/17] Add elpased time.

---
 app/assets/stylesheets/pages/milestone.scss  | 4 ++++
 app/models/milestone.rb                      | 9 +++++++++
 app/views/projects/milestones/show.html.haml | 3 +++
 3 files changed, 16 insertions(+)

diff --git a/app/assets/stylesheets/pages/milestone.scss b/app/assets/stylesheets/pages/milestone.scss
index e80dc9e84a1..8772de5f1fe 100644
--- a/app/assets/stylesheets/pages/milestone.scss
+++ b/app/assets/stylesheets/pages/milestone.scss
@@ -11,3 +11,7 @@ li.milestone {
     height: 6px;
   }
 }
+
+.time-elapsed {
+  color: #F14539;
+}
diff --git a/app/models/milestone.rb b/app/models/milestone.rb
index 7dba17726c0..21a3ab5227f 100644
--- a/app/models/milestone.rb
+++ b/app/models/milestone.rb
@@ -110,6 +110,15 @@ class Milestone < ActiveRecord::Base
     0
   end
 
+  def percent_time_used
+    return 100 if expired?
+
+    duration = ((created_at - due_date.to_datetime) / 1.day)
+    days_elapsed = ((created_at - Time.now) / 1.day)
+
+    ((days_elapsed.to_f / duration) * 100).floor
+  end
+
   def expires_at
     if due_date
       if due_date.past?
diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index 72a4164d2d4..17429cf3ddd 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -57,6 +57,9 @@
     closed
     %strong== #{@milestone.percent_complete}%
     complete
+    %span.time-elapsed
+      %strong== #{@milestone.percent_time_used}%
+      time elapsed
     %span.pull-right= @milestone.expires_at
   = milestone_progress_bar(@milestone)
 

From e6be134b6c3b56dd7afd2b5aadbd40c958895eab Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Wed, 27 Jan 2016 10:28:31 -0500
Subject: [PATCH 04/17] Change style of Delete button.

---
 app/views/projects/milestones/show.html.haml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index 17429cf3ddd..124c16ab755 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -24,7 +24,7 @@
       - else
         = link_to 'Reopen Milestone', namespace_project_milestone_path(@project.namespace, @project, @milestone, milestone: {state_event: :activate }), method: :put, class: "btn btn-reopen btn-nr btn-grouped"
 
-      = link_to namespace_project_milestone_path(@project.namespace, @project, @milestone), data: { confirm: 'Are you sure?' }, method: :delete, class: "btn btn-grouped btn-nr btn-remove" do
+      = link_to namespace_project_milestone_path(@project.namespace, @project, @milestone), data: { confirm: 'Are you sure?' }, method: :delete, class: "btn btn-grouped btn-nr" do
         = icon('trash-o')
         Delete
 

From 46b5f83a1b482bc92ab2985d70d8ab07551b75e6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Wed, 27 Jan 2016 11:45:51 -0500
Subject: [PATCH 05/17] Show labels in Issues tab.

---
 app/assets/stylesheets/pages/milestone.scss    | 12 ++++++++++++
 app/views/projects/milestones/_issue.html.haml |  4 +++-
 2 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/pages/milestone.scss b/app/assets/stylesheets/pages/milestone.scss
index 8772de5f1fe..bb246dc90c8 100644
--- a/app/assets/stylesheets/pages/milestone.scss
+++ b/app/assets/stylesheets/pages/milestone.scss
@@ -15,3 +15,15 @@ li.milestone {
 .time-elapsed {
   color: #F14539;
 }
+
+.issue-row .assignee-icon {
+  .color-label {
+    float: left;
+    padding: 8px;
+    margin-left: 10px;
+  }
+
+  img {
+    margin-left: 8px;
+  }
+}
diff --git a/app/views/projects/milestones/_issue.html.haml b/app/views/projects/milestones/_issue.html.haml
index 133d802aaca..599fb7ef5aa 100644
--- a/app/views/projects/milestones/_issue.html.haml
+++ b/app/views/projects/milestones/_issue.html.haml
@@ -1,7 +1,9 @@
 %li{ id: dom_id(issue, 'sortable'), class: 'issue-row', 'data-iid' => issue.iid, 'data-url' => issue_path(issue) }
   .pull-right.assignee-icon
+    - issue.labels.each do |label|
+      = render_colored_label(label)
     - if issue.assignee
-      = image_tag avatar_icon(issue.assignee, 16), class: "avatar s16", alt: ''
+      = image_tag avatar_icon(issue.assignee, 16), class: "avatar s24", alt: ''
   %span
     = link_to [@project.namespace.becomes(Namespace), @project, issue] do
       %span.cgray ##{issue.iid}

From 2c31ebff889a0bee1ef6c56ff80a56deebc2d67b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Wed, 27 Jan 2016 11:58:25 -0500
Subject: [PATCH 06/17] Add little spacing between milestone stats.

---
 app/assets/stylesheets/pages/milestone.scss  |  8 +++++++
 app/views/projects/milestones/show.html.haml | 23 +++++++++++---------
 2 files changed, 21 insertions(+), 10 deletions(-)

diff --git a/app/assets/stylesheets/pages/milestone.scss b/app/assets/stylesheets/pages/milestone.scss
index bb246dc90c8..a8235d02418 100644
--- a/app/assets/stylesheets/pages/milestone.scss
+++ b/app/assets/stylesheets/pages/milestone.scss
@@ -27,3 +27,11 @@ li.milestone {
     margin-left: 8px;
   }
 }
+
+.milestone-summary {
+  margin-bottom: 15px;
+}
+
+.milestone-stat {
+  margin-right: 10px;
+}
diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index 124c16ab755..a8bcad3bbd2 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -47,19 +47,22 @@
     %span All issues for this milestone are closed. You may close milestone now.
 
 .context.prepend-top-default
-  %p.lead
+  .milestone-summary
     %h4 Progress
     %strong= @milestone.issues.count
     issues:
-    %strong= @milestone.open_items_count
-    open and
-    %strong= @milestone.closed_items_count
-    closed
-    %strong== #{@milestone.percent_complete}%
-    complete
-    %span.time-elapsed
-      %strong== #{@milestone.percent_time_used}%
-      time elapsed
+    %span.milestone-stat
+      %strong= @milestone.open_items_count
+      open and
+      %strong= @milestone.closed_items_count
+      closed
+    %span.milestone-stat
+      %strong== #{@milestone.percent_complete}%
+      complete
+    %span.milestone-stat
+      %span.time-elapsed
+        %strong== #{@milestone.percent_time_used}%
+        time elapsed
     %span.pull-right= @milestone.expires_at
   = milestone_progress_bar(@milestone)
 

From 7ecd30a840fb00f7a3831adba5349cb89ecfb104 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Wed, 27 Jan 2016 12:38:03 -0500
Subject: [PATCH 07/17] Align Milestone's issue counter.

---
 app/assets/stylesheets/pages/labels.scss     |  4 ----
 app/assets/stylesheets/pages/milestone.scss  |  7 +++++++
 app/views/projects/milestones/show.html.haml | 16 +++++++++++++---
 3 files changed, 20 insertions(+), 7 deletions(-)

diff --git a/app/assets/stylesheets/pages/labels.scss b/app/assets/stylesheets/pages/labels.scss
index 0bc72f30cc3..d1590e42fcb 100644
--- a/app/assets/stylesheets/pages/labels.scss
+++ b/app/assets/stylesheets/pages/labels.scss
@@ -19,7 +19,3 @@
 .color-label {
   padding: 3px 4px;
 }
-
-#tab-labels .issues-count {
-  margin-left: 30px;
-}
diff --git a/app/assets/stylesheets/pages/milestone.scss b/app/assets/stylesheets/pages/milestone.scss
index a8235d02418..55d09ca8efe 100644
--- a/app/assets/stylesheets/pages/milestone.scss
+++ b/app/assets/stylesheets/pages/milestone.scss
@@ -35,3 +35,10 @@ li.milestone {
 .milestone-stat {
   margin-right: 10px;
 }
+
+
+#tab-labels .issues-count {
+  margin-right: 17px;
+  float: right;
+  width: 105px;
+}
diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index a8bcad3bbd2..a9cf7e96359 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -143,10 +143,20 @@
             %small.cgray= user.username
 
   .tab-pane#tab-labels
+    .gray-content-block.middle-block
+      .pull-right
+        - if can?(current_user, :create_issue, @project)
+          = link_to new_namespace_project_issue_path(@project.namespace, @project, issue: { milestone_id: @milestone.id }), class: "btn  btn-grouped", title: "New Issue" do
+            %i.fa.fa-plus
+            New Issue
+        - if can?(current_user, :read_issue, @project)
+          = link_to 'Browse Issues', namespace_project_issues_path(@milestone.project.namespace, @milestone.project, milestone_title: @milestone.title), class: "btn btn-grouped"
+
+      .oneline
+        All labels in this milestone
     %ul.bordered-list.manage-labels-list
       - @labels.each do |label|
         %li
           = render_colored_label(label)
-          .pull-right
-            %span.issues-count= pluralize label.open_issues_count, 'open issue'
-            %span.issues-count= pluralize label.closed_issues_count, 'closed issue'
+          %span.issues-count= pluralize label.open_issues_count, 'open issue'
+          %span.issues-count= pluralize label.closed_issues_count, 'closed issue'

From 2ac744e9d9986f6ddf14e5d016a4a9ae9b38af85 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Wed, 27 Jan 2016 17:00:04 -0500
Subject: [PATCH 08/17] Show buttons based on current tab.

---
 app/assets/javascripts/milestone.js.coffee   | 10 ++++++
 app/assets/stylesheets/pages/milestone.scss  |  2 +-
 app/views/projects/milestones/show.html.haml | 38 ++++++++------------
 3 files changed, 25 insertions(+), 25 deletions(-)

diff --git a/app/assets/javascripts/milestone.js.coffee b/app/assets/javascripts/milestone.js.coffee
index d644d50b669..31f6c6d3d47 100644
--- a/app/assets/javascripts/milestone.js.coffee
+++ b/app/assets/javascripts/milestone.js.coffee
@@ -64,6 +64,7 @@ class @Milestone
   constructor: ->
     @bindIssuesSorting()
     @bindMergeRequestSorting()
+    @bindTabsSwitching
 
   bindIssuesSorting: ->
     $("#issues-list-unassigned, #issues-list-ongoing, #issues-list-closed").sortable(
@@ -122,3 +123,12 @@ class @Milestone
         Milestone.updateMergeRequest(ui.item, merge_request_url, data)
 
     ).disableSelection()
+
+  bindMergeRequestSorting: ->
+    $('a[data-toggle="tab"]').on 'show.bs.tab', (e) ->
+      currentTabClass  = $(e.target).data('show')
+      previousTabClass =  $(e.relatedTarget).data('show')
+
+      $(previousTabClass).hide()
+      $(currentTabClass).removeClass('hidden')
+      $(currentTabClass).show()
diff --git a/app/assets/stylesheets/pages/milestone.scss b/app/assets/stylesheets/pages/milestone.scss
index 55d09ca8efe..f3ff00855c6 100644
--- a/app/assets/stylesheets/pages/milestone.scss
+++ b/app/assets/stylesheets/pages/milestone.scss
@@ -29,7 +29,7 @@ li.milestone {
 }
 
 .milestone-summary {
-  margin-bottom: 15px;
+  margin-bottom: 25px;
 }
 
 .milestone-stat {
diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index a9cf7e96359..460950d59d7 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -63,16 +63,26 @@
       %span.time-elapsed
         %strong== #{@milestone.percent_time_used}%
         time elapsed
-    %span.pull-right= @milestone.expires_at
+    %span.pull-right.tab-issues-buttons.tab-labels-buttons
+      - if can?(current_user, :create_issue, @project)
+        = link_to new_namespace_project_issue_path(@project.namespace, @project, issue: { milestone_id: @milestone.id }), class: "btn  btn-grouped", title: "New Issue" do
+          %i.fa.fa-plus
+          New Issue
+      - if can?(current_user, :read_issue, @project)
+        = link_to 'Browse Issues', namespace_project_issues_path(@milestone.project.namespace, @milestone.project, milestone_title: @milestone.title), class: "btn btn-grouped"
+    %span.pull-right.tab-merge-requests-buttons.hidden
+      - if can?(current_user, :read_merge_request, @project)
+        = link_to 'Browse Merge Requests', namespace_project_merge_requests_path(@milestone.project.namespace, @milestone.project, milestone_title: @milestone.title), class: "btn btn-grouped"
+
   = milestone_progress_bar(@milestone)
 
 %ul.nav-links.no-top.no-bottom
   %li.active
-    = link_to '#tab-issues', 'data-toggle' => 'tab' do
+    = link_to '#tab-issues', 'data-toggle' => 'tab', 'data-show' => '.tab-issues-buttons' do
       Issues
       %span.badge= @issues.count
   %li
-    = link_to '#tab-merge-requests', 'data-toggle' => 'tab' do
+    = link_to '#tab-merge-requests', 'data-toggle' => 'tab', 'data-show' => '.tab-merge-requests-buttons' do
       Merge Requests
       %span.badge= @merge_requests.count
   %li
@@ -80,24 +90,12 @@
       Participants
       %span.badge= @users.count
   %li
-    = link_to '#tab-labels', 'data-toggle' => 'tab' do
+    = link_to '#tab-labels', 'data-toggle' => 'tab', 'data-show' => '.tab-issues-buttons' do
       Labels
       %span.badge= @labels.count
 
 .tab-content
   .tab-pane.active#tab-issues
-    .content-block.oneline-block
-      .controls
-        - if can?(current_user, :create_issue, @project)
-          = link_to new_namespace_project_issue_path(@project.namespace, @project, issue: { milestone_id: @milestone.id }), class: "btn  btn-grouped", title: "New Issue" do
-            %i.fa.fa-plus
-            New Issue
-        - if can?(current_user, :read_issue, @project)
-          = link_to 'Browse Issues', namespace_project_issues_path(@milestone.project.namespace, @milestone.project, milestone_title: @milestone.title), class: "btn btn-grouped"
-
-      .oneline
-        All issues in this milestone
-
     .row.prepend-top-default
       .col-md-4
         = render('issues', title: 'Unstarted Issues (open and unassigned)', issues: @issues.opened.unassigned, id: 'unassigned')
@@ -107,14 +105,6 @@
         = render('issues', title: 'Completed Issues (closed)', issues: @issues.closed, id: 'closed')
 
   .tab-pane#tab-merge-requests
-    .content-block.oneline-block
-      .controls
-        - if can?(current_user, :read_merge_request, @project)
-          = link_to 'Browse Merge Requests', namespace_project_merge_requests_path(@milestone.project.namespace, @milestone.project, milestone_title: @milestone.title), class: "btn btn-grouped"
-
-      .oneline
-        All merge requests in this milestone
-
     .row.prepend-top-default
       .col-md-3
         = render('merge_requests', title: 'Work in progress (open and unassigned)', merge_requests: @merge_requests.opened.unassigned, id: 'unassigned')

From 4dff27eca50339b799b26338543648953760f1b8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Wed, 27 Jan 2016 19:18:08 -0500
Subject: [PATCH 09/17] Adjust Issues tab to new design.

---
 app/assets/stylesheets/pages/milestone.scss   | 20 +++++++++++++++++++
 .../projects/milestones/_issue.html.haml      | 11 +++++-----
 .../projects/milestones/_issues.html.haml     |  5 +++--
 3 files changed, 28 insertions(+), 8 deletions(-)

diff --git a/app/assets/stylesheets/pages/milestone.scss b/app/assets/stylesheets/pages/milestone.scss
index f3ff00855c6..88fb70b07bf 100644
--- a/app/assets/stylesheets/pages/milestone.scss
+++ b/app/assets/stylesheets/pages/milestone.scss
@@ -42,3 +42,23 @@ li.milestone {
   float: right;
   width: 105px;
 }
+
+.issues-sortable-list {
+  .issue-detail {
+    display: block;
+
+    .issue-number{
+      color: #D1D1D1;
+      margin-right: 5px;
+    }
+    .color-label {
+      padding: 8px;
+      margin-right: 7px;
+      margin-top: 10px;
+    }
+
+    .avatar {
+      float: none;
+    }
+  }
+}
diff --git a/app/views/projects/milestones/_issue.html.haml b/app/views/projects/milestones/_issue.html.haml
index 599fb7ef5aa..ca51b8c745d 100644
--- a/app/views/projects/milestones/_issue.html.haml
+++ b/app/views/projects/milestones/_issue.html.haml
@@ -1,11 +1,10 @@
 %li{ id: dom_id(issue, 'sortable'), class: 'issue-row', 'data-iid' => issue.iid, 'data-url' => issue_path(issue) }
-  .pull-right.assignee-icon
+  %span
+    = link_to_gfm issue.title, [@project.namespace.becomes(Namespace), @project, issue], title: issue.title
+  .issue-detail
+    = link_to [@project.namespace.becomes(Namespace), @project, issue] do
+      %span.issue-number ##{issue.iid}
     - issue.labels.each do |label|
       = render_colored_label(label)
     - if issue.assignee
       = image_tag avatar_icon(issue.assignee, 16), class: "avatar s24", alt: ''
-  %span
-    = link_to [@project.namespace.becomes(Namespace), @project, issue] do
-      %span.cgray ##{issue.iid}
-    = link_to_gfm issue.title, [@project.namespace.becomes(Namespace), @project, issue], title: issue.title
-
diff --git a/app/views/projects/milestones/_issues.html.haml b/app/views/projects/milestones/_issues.html.haml
index 6e4df75a3df..e0c9aa0548c 100644
--- a/app/views/projects/milestones/_issues.html.haml
+++ b/app/views/projects/milestones/_issues.html.haml
@@ -1,6 +1,7 @@
 .panel.panel-default
-  .panel-heading= title
+  .panel-heading
+    %strong= title
+    %strong.pull-right= issues.size
   %ul{ class: "well-list issues-sortable-list", id: "issues-list-#{id}", "data-state" => id }
     - issues.sort_by(&:position).each do |issue|
       = render 'issue', issue: issue
-    %li.light.ui-sort-disabled Drag and drop available

From bf181c614abd57f3b40db1b080a143559800766f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Wed, 27 Jan 2016 20:58:08 -0500
Subject: [PATCH 10/17] Remove gray background from detail.

---
 app/assets/stylesheets/pages/milestone.scss  | 5 +++++
 app/views/projects/milestones/show.html.haml | 2 +-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/pages/milestone.scss b/app/assets/stylesheets/pages/milestone.scss
index 88fb70b07bf..4226d532e34 100644
--- a/app/assets/stylesheets/pages/milestone.scss
+++ b/app/assets/stylesheets/pages/milestone.scss
@@ -62,3 +62,8 @@ li.milestone {
     }
   }
 }
+
+.milestone-detail {
+  border-bottom: 1px solid $border-color;
+  padding: 20px 0;
+}
diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index 460950d59d7..afdf18a14c9 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -32,7 +32,7 @@
         = icon('pencil-square-o')
         Edit
 
-.detail-page-description.content-block
+.detail-page-description.milestone-detail.second-block
   %h2.title
     = markdown escape_once(@milestone.title), pipeline: :single_line
   %div

From d151b3878877b74f2493015d8da7812448da1b41 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Wed, 27 Jan 2016 21:04:39 -0500
Subject: [PATCH 11/17] Adjust label height on Issues tab.

---
 app/assets/stylesheets/pages/milestone.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/pages/milestone.scss b/app/assets/stylesheets/pages/milestone.scss
index 4226d532e34..f9a1470a7cf 100644
--- a/app/assets/stylesheets/pages/milestone.scss
+++ b/app/assets/stylesheets/pages/milestone.scss
@@ -52,7 +52,7 @@ li.milestone {
       margin-right: 5px;
     }
     .color-label {
-      padding: 8px;
+      padding: 6px 10px;
       margin-right: 7px;
       margin-top: 10px;
     }

From 0a08b105801dd9eb0c32e2619a905650e7fe46e5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Thu, 28 Jan 2016 11:18:08 -0500
Subject: [PATCH 12/17] Add link to open/closed issues plus some minor updates.

---
 .../milestones/_merge_requests.html.haml      |  1 -
 app/views/projects/milestones/show.html.haml  | 25 +++++++------------
 2 files changed, 9 insertions(+), 17 deletions(-)

diff --git a/app/views/projects/milestones/_merge_requests.html.haml b/app/views/projects/milestones/_merge_requests.html.haml
index 00889a5eb24..9a5a02af215 100644
--- a/app/views/projects/milestones/_merge_requests.html.haml
+++ b/app/views/projects/milestones/_merge_requests.html.haml
@@ -3,4 +3,3 @@
   %ul{ class: "well-list merge_requests-sortable-list", id: "merge_requests-list-#{id}", "data-state" => id }
     - merge_requests.sort_by(&:position).each do |merge_request|
       = render 'merge_request', merge_request: merge_request
-    %li.light.ui-sort-disabled Drag and drop available
diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index afdf18a14c9..72506e6ecf7 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -120,9 +120,6 @@
               = render 'merge_request', merge_request: merge_request
 
   .tab-pane#tab-participants
-    .content-block.oneline-block
-      All participants to this milestone
-
     %ul.bordered-list
       - @users.each do |user|
         %li
@@ -133,20 +130,16 @@
             %small.cgray= user.username
 
   .tab-pane#tab-labels
-    .gray-content-block.middle-block
-      .pull-right
-        - if can?(current_user, :create_issue, @project)
-          = link_to new_namespace_project_issue_path(@project.namespace, @project, issue: { milestone_id: @milestone.id }), class: "btn  btn-grouped", title: "New Issue" do
-            %i.fa.fa-plus
-            New Issue
-        - if can?(current_user, :read_issue, @project)
-          = link_to 'Browse Issues', namespace_project_issues_path(@milestone.project.namespace, @milestone.project, milestone_title: @milestone.title), class: "btn btn-grouped"
-
-      .oneline
-        All labels in this milestone
     %ul.bordered-list.manage-labels-list
       - @labels.each do |label|
         %li
           = render_colored_label(label)
-          %span.issues-count= pluralize label.open_issues_count, 'open issue'
-          %span.issues-count= pluralize label.closed_issues_count, 'closed issue'
+          - args = [@milestone.project.namespace, @milestone.project, milestone_title: @milestone.title, label_name: label.title]
+          - options = args.extract_options!
+
+          %span.issues-count
+            = link_to namespace_project_issues_path(*args, options.merge(state: 'opened')) do
+              = pluralize label.open_issues_count, 'open issue'
+          %span.issues-count
+            = link_to namespace_project_issues_path(*args, options.merge(state: 'closed')) do
+              = pluralize label.closed_issues_count, 'closed issue'

From d618e9c8f819053c9c3122cfa1baa4f61d0aebce Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Thu, 28 Jan 2016 13:13:11 -0500
Subject: [PATCH 13/17] Add specs.

---
 app/models/milestone.rb                     |  1 +
 features/project/milestone.feature          | 23 +++++++++
 features/steps/project/project_milestone.rb | 53 +++++++++++++++++++++
 3 files changed, 77 insertions(+)
 create mode 100644 features/project/milestone.feature
 create mode 100644 features/steps/project/project_milestone.rb

diff --git a/app/models/milestone.rb b/app/models/milestone.rb
index 21a3ab5227f..e75a2f89d90 100644
--- a/app/models/milestone.rb
+++ b/app/models/milestone.rb
@@ -111,6 +111,7 @@ class Milestone < ActiveRecord::Base
   end
 
   def percent_time_used
+    return 0 unless due_date
     return 100 if expired?
 
     duration = ((created_at - due_date.to_datetime) / 1.day)
diff --git a/features/project/milestone.feature b/features/project/milestone.feature
new file mode 100644
index 00000000000..e0f4c0e9d7c
--- /dev/null
+++ b/features/project/milestone.feature
@@ -0,0 +1,23 @@
+Feature: Project Milestone
+  Background:
+    Given I sign in as a user
+    And I own project "Shop"
+    And project "Shop" has labels: "bug", "feature", "enhancement"
+    And project "Shop" has milestone "v2.2"
+    And milestone has issue "Bugfix1" with labels: "bug", "feature"
+    And milestone has issue "Bugfix2" with labels: "bug", "enhancement"
+
+
+  @javascript
+  Scenario: Listing issues from issues tab
+    Given I visit project "Shop" milestones page
+    And I click link "v2.2"
+    Then I should see the labels "bug", "enhancement" and "feature"
+
+  @javascript
+  Scenario: Listing labels from labels tab
+    Given I visit project "Shop" milestones page
+    And I click link "v2.2"
+    And I click link "Labels"
+    Then I should see the list of labels
+    And I should see the labels "bug", "enhancement" and "feature"
diff --git a/features/steps/project/project_milestone.rb b/features/steps/project/project_milestone.rb
new file mode 100644
index 00000000000..ec881c0d8fc
--- /dev/null
+++ b/features/steps/project/project_milestone.rb
@@ -0,0 +1,53 @@
+class Spinach::Features::ProjectMilestone < Spinach::FeatureSteps
+  include SharedAuthentication
+  include SharedProject
+  include SharedPaths
+
+  step 'milestone has issue "Bugfix1" with labels: "bug", "feature"' do
+    project = Project.find_by(name: "Shop")
+    milestone = project.milestones.find_by(title: 'v2.2')
+    issue = create(:issue, title: "Bugfix1", project: project, milestone: milestone)
+    issue.labels << project.labels.find_by(title: 'bug')
+    issue.labels << project.labels.find_by(title: 'feature')
+  end
+
+  step 'milestone has issue "Bugfix2" with labels: "bug", "enhancement"' do
+    project = Project.find_by(name: "Shop")
+    milestone = project.milestones.find_by(title: 'v2.2')
+    issue = create(:issue, title: "Bugfix2", project: project, milestone: milestone)
+    issue.labels << project.labels.find_by(title: 'bug')
+    issue.labels << project.labels.find_by(title: 'enhancement')
+  end
+
+  step 'project "Shop" has milestone "v2.2"' do
+    project = Project.find_by(name: "Shop")
+    milestone = create(:milestone,
+                       title: "v2.2",
+                       project: project,
+                       description: "# Description header"
+                      )
+    3.times { create(:issue, project: project, milestone: milestone) }
+  end
+
+  step 'I should see the list of labels' do
+    expect(page).to have_selector('ul.manage-labels-list')
+  end
+
+  step 'I should see the labels "bug", "enhancement" and "feature"' do
+    page.within('#tab-issues') do
+      expect(page).to have_content 'bug'
+      expect(page).to have_content 'enhancement'
+      expect(page).to have_content 'feature'
+    end
+  end
+
+  step 'I click link "v2.2"' do
+    click_link "v2.2"
+  end
+
+  step 'I click link "Labels"' do
+    page.within('.nav-links') do
+      page.find(:xpath, "//a[@href='#tab-labels']").click
+    end
+  end
+end

From 5bad3516d4bfac6d3445c06f5dc105ebe36c5c11 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Thu, 28 Jan 2016 13:17:20 -0500
Subject: [PATCH 14/17] Remove no longer required class.

---
 app/views/projects/milestones/show.html.haml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index 72506e6ecf7..1cf5f54e9ed 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -63,7 +63,7 @@
       %span.time-elapsed
         %strong== #{@milestone.percent_time_used}%
         time elapsed
-    %span.pull-right.tab-issues-buttons.tab-labels-buttons
+    %span.pull-right.tab-issues-buttons
       - if can?(current_user, :create_issue, @project)
         = link_to new_namespace_project_issue_path(@project.namespace, @project, issue: { milestone_id: @milestone.id }), class: "btn  btn-grouped", title: "New Issue" do
           %i.fa.fa-plus

From 31e1a38b63e7ecd555d09c5a5e34107d50a6a73c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Wed, 3 Feb 2016 10:27:46 -0500
Subject: [PATCH 15/17] Some refactor for CSS after code review.

---
 app/assets/stylesheets/pages/milestone.scss   | 45 ++++++++++---------
 app/models/milestone.rb                       |  3 ++
 .../projects/milestones/_issues.html.haml     |  4 +-
 app/views/projects/milestones/show.html.haml  |  2 +-
 4 files changed, 31 insertions(+), 23 deletions(-)

diff --git a/app/assets/stylesheets/pages/milestone.scss b/app/assets/stylesheets/pages/milestone.scss
index f9a1470a7cf..79fda5ee63a 100644
--- a/app/assets/stylesheets/pages/milestone.scss
+++ b/app/assets/stylesheets/pages/milestone.scss
@@ -12,35 +12,40 @@ li.milestone {
   }
 }
 
-.time-elapsed {
-  color: #F14539;
-}
-
-.issue-row .assignee-icon {
-  .color-label {
-    float: left;
-    padding: 8px;
-    margin-left: 10px;
+.milestone-content {
+  .issues-count {
+    margin-right: 17px;
+    float: right;
+    width: 105px;
   }
 
-  img {
-    margin-left: 8px;
+  .panel-heading {
+    font-weight: bold;
+  }
+
+  .issue-row .assignee-icon {
+    .color-label {
+      float: left;
+      padding: 8px;
+      margin-left: 10px;
+    }
+
+    img {
+      margin-left: 8px;
+    }
   }
 }
 
 .milestone-summary {
   margin-bottom: 25px;
-}
 
-.milestone-stat {
-  margin-right: 10px;
-}
+  .milestone-stat {
+    margin-right: 10px;
+  }
 
-
-#tab-labels .issues-count {
-  margin-right: 17px;
-  float: right;
-  width: 105px;
+  .time-elapsed {
+    color: $orange-light;
+  }
 }
 
 .issues-sortable-list {
diff --git a/app/models/milestone.rb b/app/models/milestone.rb
index e75a2f89d90..4b8034b6f5b 100644
--- a/app/models/milestone.rb
+++ b/app/models/milestone.rb
@@ -110,6 +110,9 @@ class Milestone < ActiveRecord::Base
     0
   end
 
+  # Returns the elapsed time (in percent) since the Milestone creation date until today.
+  # If the Milestone doesn't have a due_date then returns 0 since we can't calculate the elapsed time.
+  # If the Milestone is overdue then it returns 100%.
   def percent_time_used
     return 0 unless due_date
     return 100 if expired?
diff --git a/app/views/projects/milestones/_issues.html.haml b/app/views/projects/milestones/_issues.html.haml
index e0c9aa0548c..6f8a341e478 100644
--- a/app/views/projects/milestones/_issues.html.haml
+++ b/app/views/projects/milestones/_issues.html.haml
@@ -1,7 +1,7 @@
 .panel.panel-default
   .panel-heading
-    %strong= title
-    %strong.pull-right= issues.size
+    = title
+    .pull-right= issues.size
   %ul{ class: "well-list issues-sortable-list", id: "issues-list-#{id}", "data-state" => id }
     - issues.sort_by(&:position).each do |issue|
       = render 'issue', issue: issue
diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index 1cf5f54e9ed..631bc8c3e9d 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -94,7 +94,7 @@
       Labels
       %span.badge= @labels.count
 
-.tab-content
+.tab-content.milestone-content
   .tab-pane.active#tab-issues
     .row.prepend-top-default
       .col-md-4

From dba0d7c9f96529d32c1a94bb29ef87c5fc3839f8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Wed, 17 Feb 2016 12:33:16 -0500
Subject: [PATCH 16/17] Decrease padding of labels for Milestone's issues tab.

* Also get rid of no longer required CSS.
---
 app/assets/stylesheets/pages/milestone.scss | 10 ++--------
 1 file changed, 2 insertions(+), 8 deletions(-)

diff --git a/app/assets/stylesheets/pages/milestone.scss b/app/assets/stylesheets/pages/milestone.scss
index 79fda5ee63a..df809fb3c20 100644
--- a/app/assets/stylesheets/pages/milestone.scss
+++ b/app/assets/stylesheets/pages/milestone.scss
@@ -23,15 +23,9 @@ li.milestone {
     font-weight: bold;
   }
 
-  .issue-row .assignee-icon {
+  .issue-row {
     .color-label {
-      float: left;
-      padding: 8px;
-      margin-left: 10px;
-    }
-
-    img {
-      margin-left: 8px;
+      padding: 5px !important;
     }
   }
 }

From 62dd6745bd5d3fd1a144b13701bf80f4cb13f887 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rub=C3=A9n=20D=C3=A1vila?= <rdavila84@gmail.com>
Date: Wed, 17 Feb 2016 21:34:25 -0500
Subject: [PATCH 17/17] More styling updates.

---
 app/assets/stylesheets/pages/milestone.scss | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/app/assets/stylesheets/pages/milestone.scss b/app/assets/stylesheets/pages/milestone.scss
index df809fb3c20..9144a83647d 100644
--- a/app/assets/stylesheets/pages/milestone.scss
+++ b/app/assets/stylesheets/pages/milestone.scss
@@ -19,13 +19,15 @@ li.milestone {
     width: 105px;
   }
 
-  .panel-heading {
-    font-weight: bold;
-  }
-
   .issue-row {
     .color-label {
-      padding: 5px !important;
+      border-radius: 2px;
+      padding: 3px !important;
+    }
+
+    // Issue title
+    span a {
+      color: rgba(0,0,0,0.64);
     }
   }
 }
@@ -47,7 +49,7 @@ li.milestone {
     display: block;
 
     .issue-number{
-      color: #D1D1D1;
+      color: rgba(0,0,0,0.44);
       margin-right: 5px;
     }
     .color-label {