diff --git a/app/assets/javascripts/group_label_subscription.js b/app/assets/javascripts/group_label_subscription.js index 4683cc43017..755f94a3d1e 100644 --- a/app/assets/javascripts/group_label_subscription.js +++ b/app/assets/javascripts/group_label_subscription.js @@ -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'); } } diff --git a/app/assets/javascripts/label_manager.js b/app/assets/javascripts/label_manager.js index a8a314abd6b..06023e98ec3 100644 --- a/app/assets/javascripts/label_manager.js +++ b/app/assets/javascripts/label_manager.js @@ -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()); } } diff --git a/app/assets/javascripts/project_label_subscription.js b/app/assets/javascripts/project_label_subscription.js index a5e68d1b0a0..35a76875a7a 100644 --- a/app/assets/javascripts/project_label_subscription.js +++ b/app/assets/javascripts/project_label_subscription.js @@ -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'); } } diff --git a/app/assets/stylesheets/framework/common.scss b/app/assets/stylesheets/framework/common.scss index a8d13249ecb..d65fc0d2d68 100644 --- a/app/assets/stylesheets/framework/common.scss +++ b/app/assets/stylesheets/framework/common.scss @@ -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; } diff --git a/app/assets/stylesheets/pages/labels.scss b/app/assets/stylesheets/pages/labels.scss index bbde68cd08f..a80061c511d 100644 --- a/app/assets/stylesheets/pages/labels.scss +++ b/app/assets/stylesheets/pages/labels.scss @@ -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 { diff --git a/app/views/groups/labels/index.html.haml b/app/views/groups/labels/index.html.haml index 215e782d3da..e6b20385792 100644 --- a/app/views/groups/labels/index.html.haml +++ b/app/views/groups/labels/index.html.haml @@ -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') diff --git a/app/views/projects/labels/index.html.haml b/app/views/projects/labels/index.html.haml index 134b212298e..ba7bce6ab55 100644 --- a/app/views/projects/labels/index.html.haml +++ b/app/views/projects/labels/index.html.haml @@ -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') diff --git a/app/views/shared/_label.html.haml b/app/views/shared/_label.html.haml index 391021a7665..658d546a4a4 100644 --- a/app/views/shared/_label.html.haml +++ b/app/views/shared/_label.html.haml @@ -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) diff --git a/app/views/shared/_label_row.html.haml b/app/views/shared/_label_row.html.haml index ed23db156bc..0ae3ab8f090 100644 --- a/app/views/shared/_label_row.html.haml +++ b/app/views/shared/_label_row.html.haml @@ -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)