Clean up issuable lists
This commit is contained in:
parent
dba763322c
commit
55c6be2fb0
8 changed files with 145 additions and 74 deletions
|
@ -597,7 +597,38 @@
|
|||
.issue-info-container {
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
display: flex;
|
||||
padding-right: $gl-padding;
|
||||
|
||||
.issue-main-info {
|
||||
flex: 1 auto;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.issuable-meta {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
flex: 1 0 auto;
|
||||
|
||||
.controls {
|
||||
margin-bottom: 2px;
|
||||
line-height: 20px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.issue-updated-at {
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: $screen-xs-max) {
|
||||
.issuable-meta {
|
||||
.controls li {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.issue-check {
|
||||
|
@ -609,6 +640,30 @@
|
|||
vertical-align: text-top;
|
||||
}
|
||||
}
|
||||
|
||||
.issuable-milestone,
|
||||
.issuable-info,
|
||||
.task-status,
|
||||
.issuable-updated-at {
|
||||
font-weight: normal;
|
||||
color: $gl-text-color-secondary;
|
||||
|
||||
a {
|
||||
color: $gl-text-color;
|
||||
|
||||
.fa {
|
||||
color: $gl-text-color-secondary;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: $screen-md-max) {
|
||||
.task-status,
|
||||
.issuable-due-date,
|
||||
.project-ref-path {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -279,5 +279,9 @@
|
|||
|
||||
.label-link {
|
||||
display: inline-block;
|
||||
vertical-align: text-top;
|
||||
vertical-align: top;
|
||||
|
||||
.label {
|
||||
vertical-align: inherit;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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 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.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')}
|
||||
|
|
|
@ -4,58 +4,60 @@
|
|||
= check_box_tag dom_id(merge_request, "selected"), nil, false, 'data-id' => merge_request.id, class: "selected_issue"
|
||||
|
||||
.issue-info-container
|
||||
.merge-request-title.title
|
||||
%span.merge-request-title-text
|
||||
= link_to merge_request.title, merge_request_path(merge_request)
|
||||
.issue-main-info
|
||||
.merge-request-title.title
|
||||
%span.merge-request-title-text
|
||||
= link_to merge_request.title, merge_request_path(merge_request)
|
||||
- if merge_request.tasks?
|
||||
%span.task-status.hidden-xs
|
||||
|
||||
= merge_request.task_status
|
||||
|
||||
.issuable-info
|
||||
%span.issuable-reference
|
||||
#{issuable_reference(merge_request)}
|
||||
%span.issuable-authored.hidden-xs
|
||||
·
|
||||
opened #{time_ago_with_tooltip(merge_request.created_at, placement: 'bottom')}
|
||||
by #{link_to_member(@project, merge_request.author, avatar: false)}
|
||||
- if merge_request.milestone
|
||||
%span.issuable-milestone.hidden-xs
|
||||
|
||||
= link_to namespace_project_merge_requests_path(merge_request.project.namespace, merge_request.project, milestone_title: merge_request.milestone.title) do
|
||||
= icon('clock-o')
|
||||
= merge_request.milestone.title
|
||||
- if merge_request.target_project.default_branch != merge_request.target_branch
|
||||
%span.project-ref-path
|
||||
|
||||
= link_to project_ref_path(merge_request.project, merge_request.target_branch), class: 'ref-name' do
|
||||
= icon('code-fork')
|
||||
= merge_request.target_branch
|
||||
- if merge_request.labels.any?
|
||||
|
||||
- merge_request.labels.each do |label|
|
||||
= link_to_label(label, subject: merge_request.project, type: :merge_request, css_class: 'label-link')
|
||||
|
||||
.issuable-meta
|
||||
%ul.controls
|
||||
- if merge_request.merged?
|
||||
%li
|
||||
%li.issuable-status.hidden-xs
|
||||
MERGED
|
||||
- elsif merge_request.closed?
|
||||
%li
|
||||
%li.issuable-status.hidden-xs
|
||||
= icon('ban')
|
||||
CLOSED
|
||||
|
||||
- if merge_request.head_pipeline
|
||||
%li
|
||||
%li.issuable-pipeline-status.hidden-xs
|
||||
= render_pipeline_status(merge_request.head_pipeline)
|
||||
|
||||
- if merge_request.open? && merge_request.broken?
|
||||
%li
|
||||
%li.issuable-pipeline-broken.hidden-xs
|
||||
= link_to merge_request_path(merge_request), class: "has-tooltip", title: "Cannot be merged automatically", data: { container: 'body' } do
|
||||
= icon('exclamation-triangle')
|
||||
|
||||
- if merge_request.assignee
|
||||
%li
|
||||
= link_to_member(merge_request.source_project, merge_request.assignee, name: false, title: "Assigned to :name")
|
||||
|
||||
= render 'shared/issuable_meta_data', issuable: merge_request
|
||||
|
||||
.merge-request-info
|
||||
#{issuable_reference(merge_request)} ·
|
||||
opened #{time_ago_with_tooltip(merge_request.created_at, placement: 'bottom')}
|
||||
by #{link_to_member(@project, merge_request.author, avatar: false)}
|
||||
- if merge_request.target_project.default_branch != merge_request.target_branch
|
||||
|
||||
= link_to project_ref_path(merge_request.project, merge_request.target_branch), class: 'ref-name' do
|
||||
= icon('code-fork')
|
||||
= merge_request.target_branch
|
||||
|
||||
- if merge_request.milestone
|
||||
|
||||
= link_to namespace_project_merge_requests_path(merge_request.project.namespace, merge_request.project, milestone_title: merge_request.milestone.title) do
|
||||
= icon('clock-o')
|
||||
= merge_request.milestone.title
|
||||
|
||||
- if merge_request.labels.any?
|
||||
|
||||
- merge_request.labels.each do |label|
|
||||
= link_to_label(label, subject: merge_request.project, type: :merge_request, css_class: 'label-link')
|
||||
|
||||
- if merge_request.tasks?
|
||||
|
||||
%span.task-status
|
||||
= merge_request.task_status
|
||||
|
||||
.pull-right.hidden-xs
|
||||
.pull-right.issuable-updated-at.hidden-xs
|
||||
%span updated #{time_ago_with_tooltip(merge_request.updated_at, placement: 'bottom', html_class: 'merge_request_updated_ago')}
|
||||
|
|
|
@ -5,21 +5,21 @@
|
|||
- issuable_mr = @issuable_meta_data[issuable.id].merge_requests_count
|
||||
|
||||
- if issuable_mr > 0
|
||||
%li
|
||||
%li.issuable-mr.hidden-xs
|
||||
= image_tag('icon-merge-request-unmerged.svg', class: 'icon-merge-request-unmerged')
|
||||
= issuable_mr
|
||||
|
||||
- if upvotes > 0
|
||||
%li
|
||||
%li.issuable-upvotes.hidden-xs
|
||||
= icon('thumbs-up')
|
||||
= upvotes
|
||||
|
||||
- if downvotes > 0
|
||||
%li
|
||||
%li.issuable-downvotes.hidden-xs
|
||||
= icon('thumbs-down')
|
||||
= downvotes
|
||||
|
||||
%li
|
||||
%li.issuable-comments.hidden-xs
|
||||
= link_to issuable_url, class: ('no-comments' if note_count.zero?) do
|
||||
= icon('comments')
|
||||
= note_count
|
||||
|
|
4
changelogs/unreleased/issueable-list-cleanup.yml
Normal file
4
changelogs/unreleased/issueable-list-cleanup.yml
Normal file
|
@ -0,0 +1,4 @@
|
|||
---
|
||||
title: Clean up UI of issuable lists and make more responsive
|
||||
merge_request:
|
||||
author:
|
|
@ -65,7 +65,7 @@ class Spinach::Features::ProjectMergeRequests < Spinach::FeatureSteps
|
|||
end
|
||||
|
||||
step 'I should not see "master" branch' do
|
||||
expect(find('.merge-request-info')).not_to have_content "master"
|
||||
expect(find('.issuable-info')).not_to have_content "master"
|
||||
end
|
||||
|
||||
step 'I should see "feature_conflict" branch' do
|
||||
|
|
|
@ -459,7 +459,7 @@ describe 'Filter issues', js: true, feature: true do
|
|||
|
||||
context 'issue label clicked' do
|
||||
before do
|
||||
find('.issues-list .issue .issue-info a .label', text: multiple_words_label.title).click
|
||||
find('.issues-list .issue .issue-main-info .issuable-info a .label', text: multiple_words_label.title).click
|
||||
end
|
||||
|
||||
it 'filters' do
|
||||
|
|
Loading…
Reference in a new issue