Rename .issuable-details to .detail-page (and -header and -description)

16 files changed, 179 insertions, 179 deletions

diff --git a/app/assets/javascripts/issue.js.coffee b/app/assets/javascripts/issue.js.coffee
index 603a16da1ce..eff80bf63bb 100644
--- a/app/assets/javascripts/issue.js.coffee
+++ b/app/assets/javascripts/issue.js.coffee
@@ -10,12 +10,12 @@ class @Issue
       @initTaskList()
 
   initTaskList: ->
-    $('.issue-details .js-task-list-container').taskList('enable')
-    $(document).on 'tasklist:changed', '.issue-details .js-task-list-container', @updateTaskList
+    $('.detail-page-description .js-task-list-container').taskList('enable')
+    $(document).on 'tasklist:changed', '.detail-page-description .js-task-list-container', @updateTaskList
 
   disableTaskList: ->
-    $('.issue-details .js-task-list-container').taskList('disable')
-    $(document).off 'tasklist:changed', '.issue-details .js-task-list-container'
+    $('.detail-page-description .js-task-list-container').taskList('disable')
+    $(document).off 'tasklist:changed', '.detail-page-description .js-task-list-container'
 
   # TODO (rspeicher): Make the issue description inline-editable like a note so
   # that we can re-use its form here
diff --git a/app/assets/javascripts/merge_request.js.coffee b/app/assets/javascripts/merge_request.js.coffee
index b21cb7904b5..9047587db81 100644
--- a/app/assets/javascripts/merge_request.js.coffee
+++ b/app/assets/javascripts/merge_request.js.coffee
@@ -40,12 +40,12 @@ class @MergeRequest
     this.$('.all-commits').removeClass 'hide'
 
   initTaskList: ->
-    $('.merge-request-details .js-task-list-container').taskList('enable')
-    $(document).on 'tasklist:changed', '.merge-request-details .js-task-list-container', @updateTaskList
+    $('.detail-page-description .js-task-list-container').taskList('enable')
+    $(document).on 'tasklist:changed', '.detail-page-description .js-task-list-container', @updateTaskList
 
   disableTaskList: ->
-    $('.merge-request-details .js-task-list-container').taskList('disable')
-    $(document).off 'tasklist:changed', '.merge-request-details .js-task-list-container'
+    $('.detail-page-description .js-task-list-container').taskList('disable')
+    $(document).off 'tasklist:changed', '.detail-page-description .js-task-list-container'
 
   # TODO (rspeicher): Make the merge request description inline-editable like a
   # note so that we can re-use its form here
diff --git a/app/assets/stylesheets/framework/issue_box.scss b/app/assets/stylesheets/framework/issue_box.scss
index f12d68b5a1f..fba67ba0b64 100644
--- a/app/assets/stylesheets/framework/issue_box.scss
+++ b/app/assets/stylesheets/framework/issue_box.scss
@@ -4,7 +4,7 @@
  *
  */
 
-.issue-box {
+.status-box {
   @include border-radius(2px);
 
   display: block;
@@ -14,22 +14,22 @@
   margin-right: 10px;
   font-size: $gl-font-size;
 
-  &.issue-box-closed {
+  &.status-box-closed {
     background-color: $gl-danger;
     color: #FFF;
   }
 
-  &.issue-box-merged {
+  &.status-box-merged {
     background-color: $gl-primary;
     color: #FFF;
   }
 
-  &.issue-box-open {
+  &.status-box-open {
     background-color: #019875;
     color: #FFF;
   }
 
-  &.issue-box-expired {
+  &.status-box-expired {
     background: #cea61b;
     color: #FFF;
   }
diff --git a/app/assets/stylesheets/framework/markdown_area.scss b/app/assets/stylesheets/framework/markdown_area.scss
index 2b044786738..4a00a197d9a 100644
--- a/app/assets/stylesheets/framework/markdown_area.scss
+++ b/app/assets/stylesheets/framework/markdown_area.scss
@@ -87,7 +87,7 @@
 
 .new_note,
 .edit_note,
-.issuable-description,
+.detail-page-description,
 .milestone-description,
 .wiki-content,
 .merge-request-form {
diff --git a/app/assets/stylesheets/pages/detail_page.scss b/app/assets/stylesheets/pages/detail_page.scss
new file mode 100644
index 00000000000..0f3463a9144
--- /dev/null
+++ b/app/assets/stylesheets/pages/detail_page.scss
@@ -0,0 +1,33 @@
+.detail-page-header {
+  margin: -$gl-padding;
+  padding: 7px $gl-padding;
+  margin-bottom: 0px;
+  border-bottom: 1px solid $border-color;
+  color: #5c5d5e;
+  font-size: 16px;
+  line-height: 42px;
+
+  .author {
+    color: #5c5d5e;
+  }
+
+  .identifier {
+    color: #5c5d5e;
+  }
+}
+
+.detail-page-description {
+  .title {
+    margin: 0;
+    font-size: 23px;
+    color: #313236;
+  }
+
+  .description {
+    margin-top: 6px;
+
+    p:last-child {
+      margin-bottom: 0;
+    }
+  }
+}
diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss
index 797a0af3720..1b608b79cbf 100644
--- a/app/assets/stylesheets/pages/issuable.scss
+++ b/app/assets/stylesheets/pages/issuable.scss
@@ -36,20 +36,6 @@
 }
 
 .issuable-details {
-  .issue-title {
-    margin: 0;
-    font-size: 23px;
-    color: #313236;
-  }
-
-  .description {
-    margin-top: 6px;
-
-    p:last-child {
-      margin-bottom: 0;
-    }
-  }
-
   section {
     border-right: 1px solid #ECEEF1;
 
@@ -136,21 +122,3 @@
     margin-right: 2px;
   }
 }
-
-.issuable-title {
-  margin: -$gl-padding;
-  padding: 7px $gl-padding;
-  margin-bottom: 0px;
-  border-bottom: 1px solid $border-color;
-  color: #5c5d5e;
-  font-size: 16px;
-  line-height: 42px;
-
-  .author {
-    color: #5c5d5e;
-  }
-
-  .issuable-id {
-    color: #5c5d5e;
-  }
-}
diff --git a/app/helpers/issues_helper.rb b/app/helpers/issues_helper.rb
index cdf7038b2f2..d2186427dba 100644
--- a/app/helpers/issues_helper.rb
+++ b/app/helpers/issues_helper.rb
@@ -57,15 +57,15 @@ module IssuesHelper
     options_from_collection_for_select(milestones, 'id', 'title', object.milestone_id)
   end
 
-  def issue_box_class(item)
+  def status_box_class(item)
     if item.respond_to?(:expired?) && item.expired?
-      'issue-box-expired'
+      'status-box-expired'
     elsif item.respond_to?(:merged?) && item.merged?
-      'issue-box-merged'
+      'status-box-merged'
     elsif item.closed?
-      'issue-box-closed'
+      'status-box-closed'
     else
-      'issue-box-open'
+      'status-box-open'
     end
   end
 
diff --git a/app/views/dashboard/milestones/show.html.haml b/app/views/dashboard/milestones/show.html.haml
index 12f5d46289b..4316c358dcb 100644
--- a/app/views/dashboard/milestones/show.html.haml
+++ b/app/views/dashboard/milestones/show.html.haml
@@ -1,19 +1,18 @@
 - page_title @milestone.title, "Milestones"
 - header_title "Milestones", dashboard_milestones_path
 
-.issuable-details
-  .issuable-title
-    .issue-box{ class: "issue-box-#{@milestone.closed? ? 'closed' : 'open'}" }
-      - if @milestone.closed?
-        Closed
-      - else
-        Open
-    %span.issuable-id
-      Milestone #{@milestone.title}
+.detail-page-header
+  .status-box{ class: "status-box-#{@milestone.closed? ? 'closed' : 'open'}" }
+    - if @milestone.closed?
+      Closed
+    - else
+      Open
+  %span.identifier
+    Milestone #{@milestone.title}
 
-  .gray-content-block.second-block
-    %h2.issue-title
-      = markdown escape_once(@milestone.title), pipeline: :single_line
+.detail-page-description.gray-content-block.second-block
+  %h2.title
+    = markdown escape_once(@milestone.title), pipeline: :single_line
 
 - if @milestone.complete? && @milestone.active?
   .alert.alert-success.prepend-top-default
diff --git a/app/views/groups/milestones/show.html.haml b/app/views/groups/milestones/show.html.haml
index b0defdbb88b..d063b257b5e 100644
--- a/app/views/groups/milestones/show.html.haml
+++ b/app/views/groups/milestones/show.html.haml
@@ -1,25 +1,24 @@
 - page_title @milestone.title, "Milestones"
 = render "header_title"
 
-.issuable-details
-  .issuable-title
-    .issue-box{ class: "issue-box-#{@milestone.closed? ? 'closed' : 'open'}" }
-      - if @milestone.closed?
-        Closed
+.detail-page-header
+  .status-box{ class: "status-box-#{@milestone.closed? ? 'closed' : 'open'}" }
+    - if @milestone.closed?
+      Closed
+    - else
+      Open
+  %span.identifier
+    Milestone #{@milestone.title}
+  .pull-right
+    - if can?(current_user, :admin_milestones, @group)
+      - if @milestone.active?
+        = link_to 'Close Milestone', group_milestone_path(@group, @milestone.safe_title, title: @milestone.title, milestone: {state_event: :close }), method: :put, class: "btn btn-grouped btn-close"
       - else
-        Open
-    %span.issuable-id
-      Milestone #{@milestone.title}
-    .pull-right
-      - if can?(current_user, :admin_milestones, @group)
-        - if @milestone.active?
-          = link_to 'Close Milestone', group_milestone_path(@group, @milestone.safe_title, title: @milestone.title, milestone: {state_event: :close }), method: :put, class: "btn btn-grouped btn-close"
-        - else
-          = link_to 'Reopen Milestone', group_milestone_path(@group, @milestone.safe_title, title: @milestone.title, milestone: {state_event: :activate }), method: :put, class: "btn btn-grouped btn-reopen"
+        = link_to 'Reopen Milestone', group_milestone_path(@group, @milestone.safe_title, title: @milestone.title, milestone: {state_event: :activate }), method: :put, class: "btn btn-grouped btn-reopen"
 
-  .gray-content-block.second-block
-    %h2.issue-title
-      = markdown escape_once(@milestone.title), pipeline: :single_line
+.detail-page-description.gray-content-block.second-block
+  %h2.title
+    = markdown escape_once(@milestone.title), pipeline: :single_line
 
 - if @milestone.complete? && @milestone.active?
   .alert.alert-success.prepend-top-default
diff --git a/app/views/projects/issues/show.html.haml b/app/views/projects/issues/show.html.haml
index cc2cf8c8716..509bad0e5d4 100644
--- a/app/views/projects/issues/show.html.haml
+++ b/app/views/projects/issues/show.html.haml
@@ -2,44 +2,45 @@
 = render "header_title"
 
 .issue
-  .issue-details.issuable-details
-    .issuable-title
-      .issue-box{ class: issue_box_class(@issue) }
+  .detail-page-header
+    .status-box{ class: status_box_class(@issue) }
+      - if @issue.closed?
+        Closed
+      - else
+        Open
+    %span.identifier
+      Issue ##{@issue.iid}
+    %span.creator
+      ·
+      opened by #{link_to_member(@project, @issue.author, size: 24)}
+      ·
+      = time_ago_with_tooltip(@issue.created_at, placement: 'bottom', html_class: 'issue_created_ago')
+      - if @issue.updated_at != @issue.created_at
+        %span
+          ·
+          = icon('edit', title: 'edited')
+          = time_ago_with_tooltip(@issue.updated_at, placement: 'bottom', html_class: 'issue_edited_ago')
+
+    .pull-right
+      - if can?(current_user, :create_issue, @project)
+        = link_to new_namespace_project_issue_path(@project.namespace, @project), class: 'btn btn-grouped new-issue-link', title: 'New Issue', id: 'new_issue_link' do
+          = icon('plus')
+          New Issue
+      - if can?(current_user, :update_issue, @issue)
         - if @issue.closed?
-          Closed
+          = link_to 'Reopen', issue_path(@issue, issue: {state_event: :reopen}, status_only: true), method: :put, class: 'btn btn-grouped btn-reopen'
         - else
-          Open
-      %span.issuable-id Issue ##{@issue.iid}
-      %span.creator
-        ·
-        opened by #{link_to_member(@project, @issue.author, size: 24)}
-        ·
-        = time_ago_with_tooltip(@issue.created_at, placement: 'bottom', html_class: 'issue_created_ago')
-        - if @issue.updated_at != @issue.created_at
-          %span
-            ·
-            = icon('edit', title: 'edited')
-            = time_ago_with_tooltip(@issue.updated_at, placement: 'bottom', html_class: 'issue_edited_ago')
+          = link_to 'Close', issue_path(@issue, issue: {state_event: :close}, status_only: true), method: :put, class: 'btn btn-grouped btn-close', title: 'Close Issue'
 
-      .pull-right
-        - if can?(current_user, :create_issue, @project)
-          = link_to new_namespace_project_issue_path(@project.namespace, @project), class: 'btn btn-grouped new-issue-link', title: 'New Issue', id: 'new_issue_link' do
-            = icon('plus')
-            New Issue
-        - if can?(current_user, :update_issue, @issue)
-          - if @issue.closed?
-            = link_to 'Reopen', issue_path(@issue, issue: {state_event: :reopen}, status_only: true), method: :put, class: 'btn btn-grouped btn-reopen'
-          - else
-            = link_to 'Close', issue_path(@issue, issue: {state_event: :close}, status_only: true), method: :put, class: 'btn btn-grouped btn-close', title: 'Close Issue'
-
-          = link_to edit_namespace_project_issue_path(@project.namespace, @project, @issue), class: 'btn btn-grouped issuable-edit' do
-            = icon('pencil-square-o')
-            Edit
+        = link_to edit_namespace_project_issue_path(@project.namespace, @project, @issue), class: 'btn btn-grouped issuable-edit' do
+          = icon('pencil-square-o')
+          Edit
 
+  .issue-details.issuable-details
     .row
       %section.col-md-9
-        .gray-content-block
-          %h2.issue-title
+        .detail-page-description.gray-content-block
+          %h2.title
             = markdown escape_once(@issue.title), pipeline: :single_line
           %div
             - if @issue.description.present?
diff --git a/app/views/projects/merge_requests/_show.html.haml b/app/views/projects/merge_requests/_show.html.haml
index 04f8fd74422..ad9b8389160 100644
--- a/app/views/projects/merge_requests/_show.html.haml
+++ b/app/views/projects/merge_requests/_show.html.haml
@@ -5,8 +5,9 @@
   - fluid_layout true
 
 .merge-request{'data-url' => merge_request_path(@merge_request)}
+  = render "projects/merge_requests/show/mr_title"
+  
   .merge-request-details.issuable-details
-    = render "projects/merge_requests/show/mr_title"
     .row
       %section.col-md-9
         = render "projects/merge_requests/show/mr_box"
diff --git a/app/views/projects/merge_requests/show/_mr_box.html.haml b/app/views/projects/merge_requests/show/_mr_box.html.haml
index 9bfe202589e..867e178fb7c 100644
--- a/app/views/projects/merge_requests/show/_mr_box.html.haml
+++ b/app/views/projects/merge_requests/show/_mr_box.html.haml
@@ -1,5 +1,5 @@
-.gray-content-block.middle-block
-  %h2.issue-title
+.detail-page-description.gray-content-block.middle-block
+  %h2.title
     = markdown escape_once(@merge_request.title), pipeline: :single_line
 
   %div
diff --git a/app/views/projects/merge_requests/show/_mr_title.html.haml b/app/views/projects/merge_requests/show/_mr_title.html.haml
index d65c3b16618..acb207eb1d6 100644
--- a/app/views/projects/merge_requests/show/_mr_title.html.haml
+++ b/app/views/projects/merge_requests/show/_mr_title.html.haml
@@ -1,7 +1,8 @@
-.issuable-title
-  .issue-box{ class: issue_box_class(@merge_request) }
+.detail-page-header
+  .status-box{ class: status_box_class(@merge_request) }
     = @merge_request.state_human_name
-  %span.issuable-id Merge Request ##{@merge_request.iid}
+  %span.identifier
+    Merge Request ##{@merge_request.iid}
   %span.creator
     ·
     opened by #{link_to_member(@project, @merge_request.author, size: 24)}
diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index 83f27100b76..7e73ae274e9 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -1,45 +1,44 @@
 - page_title @milestone.title, "Milestones"
 = render "header_title"
 
-.issuable-details
-  .issuable-title
-    .issue-box{ class: issue_box_class(@milestone) }
-      - if @milestone.closed?
-        Closed
-      - elsif @milestone.expired?
-        Expired
+.detail-page-header
+  .status-box{ class: status_box_class(@milestone) }
+    - if @milestone.closed?
+      Closed
+    - elsif @milestone.expired?
+      Expired
+    - else
+      Open
+  %span.identifier
+    Milestone ##{@milestone.iid}
+  - if @milestone.expires_at
+    %span.creator
+      ·
+      = @milestone.expires_at
+  .pull-right
+    - if can?(current_user, :admin_milestone, @project)
+      - if @milestone.active?
+        = link_to 'Close Milestone', namespace_project_milestone_path(@project.namespace, @project, @milestone, milestone: {state_event: :close }), method: :put, class: "btn btn-close btn-grouped"
       - else
-        Open
-    %span.issuable-id
-      Milestone ##{@milestone.iid}
-    - if @milestone.expires_at
-      %span.creator
-        ·
-        = @milestone.expires_at
-    .pull-right
-      - if can?(current_user, :admin_milestone, @project)
-        - if @milestone.active?
-          = link_to 'Close Milestone', namespace_project_milestone_path(@project.namespace, @project, @milestone, milestone: {state_event: :close }), method: :put, class: "btn btn-close btn-grouped"
-        - else
-          = link_to 'Reopen Milestone', namespace_project_milestone_path(@project.namespace, @project, @milestone, milestone: {state_event: :activate }), method: :put, class: "btn btn-reopen btn-grouped"
+        = link_to 'Reopen Milestone', namespace_project_milestone_path(@project.namespace, @project, @milestone, milestone: {state_event: :activate }), method: :put, class: "btn btn-reopen btn-grouped"
 
-        = link_to namespace_project_milestone_path(@project.namespace, @project, @milestone), data: { confirm: 'Are you sure?' }, method: :delete, class: "btn btn-grouped btn-remove" do
-          %i.fa.fa-trash-o
-          Delete
-        
-        = link_to edit_namespace_project_milestone_path(@project.namespace, @project, @milestone), class: "btn btn-grouped" do
-          %i.fa.fa-pencil-square-o
-          Edit
+      = link_to namespace_project_milestone_path(@project.namespace, @project, @milestone), data: { confirm: 'Are you sure?' }, method: :delete, class: "btn btn-grouped btn-remove" do
+        %i.fa.fa-trash-o
+        Delete
 
-  .gray-content-block.second-block
-    %h2.issue-title
-      = markdown escape_once(@milestone.title), pipeline: :single_line
-    %div
-      - if @milestone.description.present?
-        .description
-          .wiki
-            = preserve do
-              = markdown @milestone.description
+      = link_to edit_namespace_project_milestone_path(@project.namespace, @project, @milestone), class: "btn btn-grouped" do
+        %i.fa.fa-pencil-square-o
+        Edit
+
+.detail-page-description.gray-content-block.second-block
+  %h2.title
+    = markdown escape_once(@milestone.title), pipeline: :single_line
+  %div
+    - if @milestone.description.present?
+      .description
+        .wiki
+          = preserve do
+            = markdown @milestone.description
 
 - if @milestone.issues.any? && @milestone.can_be_closed?
   .alert.alert-success.prepend-top-default
diff --git a/app/views/shared/issuable/_form.html.haml b/app/views/shared/issuable/_form.html.haml
index 91ccd1ef660..90dc0062481 100644
--- a/app/views/shared/issuable/_form.html.haml
+++ b/app/views/shared/issuable/_form.html.haml
@@ -19,7 +19,7 @@
         - else
           Start the title with <code>[WIP]</code> or <code>WIP:</code> to prevent a
           <strong>Work In Progress</strong> merge request from being merged before it's ready.
-.form-group.issuable-description
+.form-group.detail-page-description
   = f.label :description, 'Description', class: 'control-label'
   .col-sm-10
 
diff --git a/app/views/shared/snippets/_header.html.haml b/app/views/shared/snippets/_header.html.haml
index 04a2f5a2b3b..aa5acee9c14 100644
--- a/app/views/shared/snippets/_header.html.haml
+++ b/app/views/shared/snippets/_header.html.haml
@@ -1,26 +1,25 @@
-.issuable-details
-  .issuable-title
-    .snippet-box.has_tooltip{class: visibility_level_color(@snippet.visibility_level), title: snippet_visibility_level_description(@snippet.visibility_level, @snippet), data: { container: 'body' }}
-      = visibility_level_icon(@snippet.visibility_level, fw: false)
-      = visibility_level_label(@snippet.visibility_level)
-    %span.issuable-id
-      Snippet ##{@snippet.id}
-    %span.creator
-      &middot; created by #{link_to_member(@project, @snippet.author, size: 24)}
-      &middot;
-      = time_ago_with_tooltip(@snippet.created_at, placement: 'bottom', html_class: 'snippet_updated_ago')
-      - if @snippet.updated_at != @snippet.created_at
-        %span
-          &middot;
-          = icon('edit', title: 'edited')
-          = time_ago_with_tooltip(@snippet.updated_at, placement: 'bottom', html_class: 'snippet_edited_ago')
+.detail-page-header
+  .snippet-box.has_tooltip{class: visibility_level_color(@snippet.visibility_level), title: snippet_visibility_level_description(@snippet.visibility_level, @snippet), data: { container: 'body' }}
+    = visibility_level_icon(@snippet.visibility_level, fw: false)
+    = visibility_level_label(@snippet.visibility_level)
+  %span.identifier
+    Snippet ##{@snippet.id}
+  %span.creator
+    &middot; created by #{link_to_member(@project, @snippet.author, size: 24)}
+    &middot;
+    = time_ago_with_tooltip(@snippet.created_at, placement: 'bottom', html_class: 'snippet_updated_ago')
+    - if @snippet.updated_at != @snippet.created_at
+      %span
+        &middot;
+        = icon('edit', title: 'edited')
+        = time_ago_with_tooltip(@snippet.updated_at, placement: 'bottom', html_class: 'snippet_edited_ago')
 
-    .pull-right
-      - if @snippet.project_id?
-        = render "projects/snippets/actions"
-      - else
-        = render "snippets/actions"
+  .pull-right
+    - if @snippet.project_id?
+      = render "projects/snippets/actions"
+    - else
+      = render "snippets/actions"
 
-  .gray-content-block.second-block
-    %h2.issue-title
-      = markdown escape_once(@snippet.title), pipeline: :single_line
+.detail-page-description.gray-content-block.second-block
+  %h2.title
+    = markdown escape_once(@snippet.title), pipeline: :single_line