1 files changed, 36 insertions, 30 deletions

diff --git a/app/views/projects/issues/_issue.html.haml b/app/views/projects/issues/_issue.html.haml
index 9e4e6934ca9..7dc35be57a6 100644
--- a/app/views/projects/issues/_issue.html.haml
+++ b/app/views/projects/issues/_issue.html.haml
@@ -4,43 +4,49 @@
       .issue-check.hidden
         = check_box_tag dom_id(issue, "selected"), nil, false, 'data-id' => issue.id, class: "selected_issue"
     .issue-info-container
-      .issue-title.title
-        %span.issue-title-text
-          = confidential_icon(issue)
-          = link_to issue.title, issue_path(issue)
+      .issue-main-info
+        .issue-title.title
+          %span.issue-title-text
+            = confidential_icon(issue)
+            = link_to issue.title, issue_path(issue)
+          - if issue.tasks?
+            %span.task-status.hidden-xs
+               
+              = issue.task_status
+
+        .issuable-info
+          %span.issuable-reference
+            #{issuable_reference(issue)}
+          %span.issuable-authored.hidden-xs
+            ·
+            opened #{time_ago_with_tooltip(issue.created_at, placement: 'bottom')}
+            by #{link_to_member(@project, issue.author, avatar: false)}
+          - if issue.milestone
+            %span.issuable-milestone.hidden-xs
+               
+              = link_to project_issues_path(issue.project, milestone_title: issue.milestone.title) do
+                = icon('clock-o')
+                = issue.milestone.title
+          - if issue.due_date
+            %span.issuable-due-date.hidden-xs{ class: "#{'cred' if issue.overdue?}" }
+               
+              = icon('calendar')
+              = issue.due_date.to_s(:medium)
+          - if issue.labels.any?
+             
+            - issue.labels.each do |label|
+              = link_to_label(label, subject: issue.project, css_class: 'label-link')
+
+      .issuable-meta
         %ul.controls
           - if issue.closed?
-            %li
+            %li.issuable-status
               CLOSED
-
           - if issue.assignees.any?
             %li
               = render 'shared/issuable/assignees', project: @project, issue: issue
 
           = render 'shared/issuable_meta_data', issuable: issue
 
-      .issue-info
-        #{issuable_reference(issue)} ·
-        opened #{time_ago_with_tooltip(issue.created_at, placement: 'bottom')}
-        by #{link_to_member(@project, issue.author, avatar: false)}
-        - if issue.milestone
-           
-          = link_to namespace_project_issues_path(issue.project.namespace, issue.project, milestone_title: issue.milestone.title) do
-            = icon('clock-o')
-            = issue.milestone.title
-        - if issue.due_date
-          %span{ class: "#{'cred' if issue.overdue?}" }
-             
-            = icon('calendar')
-            = issue.due_date.to_s(:medium)
-        - if issue.labels.any?
-           
-          - issue.labels.each do |label|
-            = link_to_label(label, subject: issue.project, css_class: 'label-link')
-        - if issue.tasks?
-           
-          %span.task-status
-            = issue.task_status
-
-        .pull-right.issue-updated-at
+        .pull-right.issuable-updated-at.hidden-xs
           %span updated #{time_ago_with_tooltip(issue.updated_at, placement: 'bottom', html_class: 'issue_update_ago')}