FE review changes

This commit is contained in:
Luke Bennett 2018-06-05 10:47:43 +01:00
parent 9b9cdc984c
commit 7e36fa398b
No known key found for this signature in database
GPG Key ID: A738E9C68D3BF31A
9 changed files with 44 additions and 39 deletions

View File

@ -1,7 +1,12 @@
import $ from 'jquery';
import { __ } from '~/locale';
import axios from './lib/utils/axios_utils';
import flash from './flash';
import { __ } from './locale';
const tooltipTitles = {
group: __('Unsubscribe at group level'),
project: __('Unsubscribe at project level'),
};
export default class GroupLabelSubscription {
constructor(container) {
@ -48,11 +53,11 @@ export default class GroupLabelSubscription {
static setNewTooltip($button) {
if (!$button.hasClass('js-subscribe-button')) return;
const type = $button.hasClass('js-group-level') ? 'group' : 'project';
const title = `Unsubscribe at ${type} level`;
const $unsubscribeButton = $('.js-unsubscribe-button', $button.closest('.label-actions-list'));
const newTitle = tooltipTitles[type];
$unsubscribeButton.tooltip('hide').attr('title', title).tooltip('_fixTitle');
$('.js-unsubscribe-button', $button.closest('.label-actions-list'))
.tooltip('hide').attr('title', newTitle).tooltip('_fixTitle');
}
}

View File

@ -13,7 +13,7 @@ export default class LabelManager {
this.otherLabels = otherLabels || $('.js-other-labels');
this.errorMessage = 'Unable to update label prioritization at this time';
this.emptyState = document.querySelector('#js-priority-labels-empty-state');
this.$badgeItemTemplate = $(document.getElementById('js-badge-item-template').innerHTML);
this.$badgeItemTemplate = $('#js-badge-item-template');
this.sortable = Sortable.create(this.prioritizedLabels.get(0), {
filter: '.empty-message',
forceFallback: true,
@ -97,7 +97,7 @@ export default class LabelManager {
if (action === 'remove') {
$('.js-priority-badge', $label).remove();
} else {
$('.label-links', $label).append(this.$badgeItemTemplate.clone());
$('.label-links', $label).append(this.$badgeItemTemplate.clone().html());
}
}

View File

@ -3,6 +3,17 @@ import { __ } from './locale';
import axios from './lib/utils/axios_utils';
import flash from './flash';
const tooltipTitles = {
group: {
subscribed: __('Unsubscribe at group level'),
unsubscribed: __('Subscribe at group level'),
},
project: {
subscribed: __('Unsubscribe at project level'),
unsubscribed: __('Subscribe at project level'),
},
};
export default class ProjectLabelSubscription {
constructor(container) {
this.$container = $(container);
@ -48,11 +59,10 @@ export default class ProjectLabelSubscription {
}).catch(() => flash(__('There was an error subscribing to this label.')));
}
static setNewTitle($button, originalTitle, newStatus, newAction) {
const newStatusVerb = newStatus.slice(0, -1);
const actionRegexp = new RegExp(newStatusVerb, 'i');
const newTitle = originalTitle.replace(actionRegexp, newAction);
static setNewTitle($button, originalTitle, newStatus) {
const type = /group/.test(originalTitle) ? 'group' : 'project';
const newTitle = tooltipTitles[type][newStatus];
$button.tooltip('hide').attr('data-original-title', newTitle).tooltip('_fixTitle');
$button.tooltip('hide').attr('title', newTitle).tooltip('_fixTitle');
}
}

View File

@ -464,7 +464,6 @@ img.emoji {
.prepend-left-5 { margin-left: 5px; }
.prepend-left-8 { margin-left: 8px; }
.prepend-left-10 { margin-left: 10px; }
.prepend-left-15 { margin-left: 15px; }
.prepend-left-default { margin-left: $gl-padding; }
.prepend-left-20 { margin-left: 20px; }
.append-right-5 { margin-right: 5px; }

View File

@ -77,7 +77,7 @@
margin-bottom: 5px;
display: flex;
justify-content: space-between;
padding: 11px 10px 11px $gl-padding;
padding: 8px 8px 8px $gl-padding;
border-radius: $border-radius-default;
&.sortable-ghost {
@ -270,7 +270,6 @@
.content-list &::before,
.content-list &::after {
content: none;
display: block;
}
.label-name {
@ -284,12 +283,6 @@
}
}
.label-type {
display: block;
margin-bottom: 10px;
margin-left: 50px;
}
.label-description {
flex-grow: 1;
@ -302,7 +295,7 @@
padding: 4px $grid-size;
font-size: $label-font-size;
position: relative;
top: ($grid-size / 2);
top: $gl-padding-4;
}
.label-action {

View File

@ -8,8 +8,7 @@
- if can_admin_label
- content_for(:header_content) do
.nav-controls
= link_to new_group_label_path(@group), class: "btn btn-new" do
= _('New label')
= link_to _('New label'), new_group_label_path(@group), class: "btn btn-new"
- if @labels.exists?
#promote-label-modal
@ -32,4 +31,4 @@
%template#js-badge-item-template
%li.label-link-item.js-priority-badge.inline.prepend-left-10
.label-badge.label-badge-blue Prioritized label
.label-badge.label-badge-blue= _('Prioritized label')

View File

@ -6,24 +6,23 @@
- if can_admin_label
- content_for(:header_content) do
.nav-controls
= link_to new_project_label_path(@project), class: "btn btn-new" do
New label
= link_to _('New label'), new_project_label_path(@project), class: "btn btn-new"
- if @labels.exists? || @prioritized_labels.exists?
#promote-label-modal
%div{ class: container_class }
.top-area.adjust
.nav-text
Labels can be applied to issues and merge requests.
= _('Labels can be applied to issues and merge requests.')
- if can_admin_label
Star a label to make it a priority label. Order the prioritized labels to change their relative priority, by dragging.
= _('Star a label to make it a priority label. Order the prioritized labels to change their relative priority, by dragging.')
.labels-container.prepend-top-5
- if can_admin_label
-# Only show it in the first page
- hide = @available_labels.empty? || (params[:page].present? && params[:page] != '1')
.prioritized-labels{ class: ('hide' if hide) }
%h5.prepend-top-0 Prioritized Labels
%h5.prepend-top-0= _('Prioritized Labels')
.content-list.manage-labels-list.js-prioritized-labels{ "data-url" => set_priorities_project_labels_path(@project) }
#js-priority-labels-empty-state.priority-labels-empty-state{ class: "#{'hidden' unless @prioritized_labels.empty?}" }
= render 'shared/empty_states/priority_labels'
@ -33,7 +32,7 @@
- if @labels.present?
.other-labels
- if can_admin_label
%h5{ class: ('hide' if hide) } Other Labels
%h5{ class: ('hide' if hide) }= _('Other Labels')
.content-list.manage-labels-list.js-other-labels
= render partial: 'shared/label', subject: @project, collection: @labels, as: :label
= paginate @labels, theme: 'gitlab'
@ -42,4 +41,4 @@
%template#js-badge-item-template
%li.label-link-item.js-priority-badge.inline.prepend-left-10
.label-badge.label-badge-blue Prioritized label
.label-badge.label-badge-blue= _('Prioritized label')

View File

@ -11,22 +11,22 @@
%li.label-list-item{ id: label_css_id, data: { id: label.id } }
= render "shared/label_row", label: label, subject: subject, force_priority: force_priority
%ul.label-actions-list
- if controller.is_a?(Projects::LabelsController)
- if @project
%li.inline
.label-badge.label-badge-gray= label.model_name.human.capitalize
- if can?(current_user, :admin_label, @project)
%li.inline.js-toggle-priority{ data: { url: remove_priority_project_label_path(@project, label),
dom_id: dom_id(label), type: label.type } }
%button.label-action.add-priority.btn.btn-transparent.has-tooltip{ title: _('Prioritize'), type: 'button', :'data-placement' => 'top' }
%button.label-action.add-priority.btn.btn-transparent.has-tooltip{ title: _('Prioritize'), type: 'button', data: { placement: 'top' }, aria_label: _('Prioritize label') }
= sprite_icon('star-o')
%button.label-action.remove-priority.btn.btn-transparent.has-tooltip{ title: _('Remove priority'), type: 'button', :'data-placement' => 'top' }
%button.label-action.remove-priority.btn.btn-transparent.has-tooltip{ title: _('Remove priority'), type: 'button', data: { placement: 'top' }, aria_label: _('Deprioritize label') }
= sprite_icon('star')
%li.inline
= link_to edit_label_path(label), class: 'btn btn-transparent label-action' do
= link_to edit_label_path(label), class: 'btn btn-transparent label-action', aria_label: 'Edit label' do
= sprite_icon('pencil')
%li.inline
.dropdown
%button{ type: 'button', class: 'btn btn-transparent js-label-options-dropdown label-action', data: { toggle: 'dropdown' } }
%button{ type: 'button', class: 'btn btn-transparent js-label-options-dropdown label-action', data: { toggle: 'dropdown' }, aria_label: _('Label actions dropdown') }
= sprite_icon('ellipsis_v')
.dropdown-menu.dropdown-open-left
%ul
@ -44,7 +44,7 @@
= _('Promote to group label')
%li
%span{ data: { toggle: 'modal', target: "#modal-delete-label-#{label.id}" } }
= button_tag 'Delete', type: 'button', class: 'text-danger remove-row'
%button.text-danger.remove-row{ type: 'button' }= _('Delete')
- if current_user
%li.inline.label-subscription
- if can_subscribe_to_label_in_different_levels?(label)

View File

@ -6,7 +6,7 @@
.label-name
= link_to_label(label, subject: @project, tooltip: false)
.label-description
.append-right-15.prepend-left-15
.append-right-default.prepend-left-default
- if label.description.present?
.description-text.append-bottom-10
= markdown_field(label, :description)