GL dropdown default toggle color
This commit is contained in:
parent
82ef4f1ef7
commit
0a98608179
|
@ -617,7 +617,14 @@ class GitLabDropdown
|
||||||
$dropdownContent.scrollTop(listItemTop - dropdownContentTop)
|
$dropdownContent.scrollTop(listItemTop - dropdownContentTop)
|
||||||
|
|
||||||
updateLabel: (selected = null, el = null, instance = null, added = false) =>
|
updateLabel: (selected = null, el = null, instance = null, added = false) =>
|
||||||
$(@el).find(".dropdown-toggle-text").text @options.toggleLabel(selected, el, instance, added)
|
$toggleText = $(@el).find(".dropdown-toggle-text")
|
||||||
|
$toggleText.text @options.toggleLabel(selected, el, instance, added)
|
||||||
|
|
||||||
|
if @options.defaultLabel
|
||||||
|
if $toggleText.text().trim() is @options.defaultLabel
|
||||||
|
$toggleText.addClass('is-default')
|
||||||
|
else
|
||||||
|
$toggleText.removeClass('is-default')
|
||||||
|
|
||||||
$.fn.glDropdown = (opts) ->
|
$.fn.glDropdown = (opts) ->
|
||||||
return @.each ->
|
return @.each ->
|
||||||
|
|
|
@ -4,6 +4,7 @@ class @LabelsSelect
|
||||||
|
|
||||||
$('.js-label-select').each (i, dropdown) ->
|
$('.js-label-select').each (i, dropdown) ->
|
||||||
$dropdown = $(dropdown)
|
$dropdown = $(dropdown)
|
||||||
|
$toggleText = $dropdown.find('.dropdown-toggle-text')
|
||||||
projectId = $dropdown.data('project-id')
|
projectId = $dropdown.data('project-id')
|
||||||
labelUrl = $dropdown.data('labels')
|
labelUrl = $dropdown.data('labels')
|
||||||
issueUpdateURL = $dropdown.data('issueUpdate')
|
issueUpdateURL = $dropdown.data('issueUpdate')
|
||||||
|
@ -280,12 +281,16 @@ class @LabelsSelect
|
||||||
index = selectedLabels.indexOf selected.title
|
index = selectedLabels.indexOf selected.title
|
||||||
selectedLabels.splice index, 1
|
selectedLabels.splice index, 1
|
||||||
|
|
||||||
|
if selected.id? and selected.id is 0
|
||||||
|
selectedLabels = []
|
||||||
|
|
||||||
if selectedLabels.length > 1
|
if selectedLabels.length > 1
|
||||||
"#{selectedLabels[0]} +#{selectedLabels.length - 1} more"
|
"#{selectedLabels[0]} +#{selectedLabels.length - 1} more"
|
||||||
else if selectedLabels.length is 1
|
else if selectedLabels.length is 1
|
||||||
selectedLabels[0]
|
selectedLabels[0]
|
||||||
else
|
else
|
||||||
defaultLabel
|
defaultLabel
|
||||||
|
defaultLabel: defaultLabel
|
||||||
fieldName: $dropdown.data('field-name')
|
fieldName: $dropdown.data('field-name')
|
||||||
id: (label) ->
|
id: (label) ->
|
||||||
if $dropdown.hasClass('js-issuable-form-dropdown')
|
if $dropdown.hasClass('js-issuable-form-dropdown')
|
||||||
|
|
|
@ -70,11 +70,12 @@ class @MilestoneSelect
|
||||||
search:
|
search:
|
||||||
fields: ['title']
|
fields: ['title']
|
||||||
selectable: true
|
selectable: true
|
||||||
toggleLabel: (selected) ->
|
toggleLabel: (selected, el, e, added) ->
|
||||||
if selected && 'id' of selected
|
if selected and 'id' of selected and added
|
||||||
selected.title
|
selected.title
|
||||||
else
|
else
|
||||||
defaultLabel
|
defaultLabel
|
||||||
|
defaultLabel: defaultLabel
|
||||||
fieldName: $dropdown.data('field-name')
|
fieldName: $dropdown.data('field-name')
|
||||||
text: (milestone) ->
|
text: (milestone) ->
|
||||||
_.escape(milestone.title)
|
_.escape(milestone.title)
|
||||||
|
|
|
@ -142,12 +142,12 @@ class @UsersSelect
|
||||||
selectable: true
|
selectable: true
|
||||||
fieldName: $dropdown.data('field-name')
|
fieldName: $dropdown.data('field-name')
|
||||||
|
|
||||||
toggleLabel: (selected) ->
|
toggleLabel: (selected, el, e, added) ->
|
||||||
if selected && 'id' of selected
|
if selected and 'id' of selected and added
|
||||||
if selected.text then selected.text else selected.name
|
if selected.text then selected.text else selected.name
|
||||||
else
|
else
|
||||||
defaultLabel
|
defaultLabel
|
||||||
|
defaultLabel: defaultLabel
|
||||||
inputId: 'issue_assignee_id'
|
inputId: 'issue_assignee_id'
|
||||||
|
|
||||||
hidden: (e) ->
|
hidden: (e) ->
|
||||||
|
|
|
@ -562,3 +562,9 @@
|
||||||
display: block;
|
display: block;
|
||||||
color: $gl-placeholder-color;
|
color: $gl-placeholder-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.dropdown-toggle-text {
|
||||||
|
&.is-default {
|
||||||
|
color: $gl-placeholder-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -40,8 +40,9 @@ module DropdownsHelper
|
||||||
end
|
end
|
||||||
|
|
||||||
def dropdown_toggle(toggle_text, data_attr, options = {})
|
def dropdown_toggle(toggle_text, data_attr, options = {})
|
||||||
|
default_label = options[:data][:default_label]
|
||||||
content_tag(:button, class: "dropdown-menu-toggle #{options[:toggle_class] if options.has_key?(:toggle_class)}", id: (options[:id] if options.has_key?(:id)), type: "button", data: data_attr) do
|
content_tag(:button, class: "dropdown-menu-toggle #{options[:toggle_class] if options.has_key?(:toggle_class)}", id: (options[:id] if options.has_key?(:id)), type: "button", data: data_attr) do
|
||||||
output = content_tag(:span, toggle_text, class: "dropdown-toggle-text")
|
output = content_tag(:span, toggle_text, class: "dropdown-toggle-text #{'is-default' if toggle_text == default_label}")
|
||||||
output << icon('chevron-down')
|
output << icon('chevron-down')
|
||||||
output.html_safe
|
output.html_safe
|
||||||
end
|
end
|
||||||
|
|
|
@ -18,7 +18,7 @@
|
||||||
= hidden_field_tag data_options[:field_name], label, id: nil
|
= hidden_field_tag data_options[:field_name], label, id: nil
|
||||||
.dropdown
|
.dropdown
|
||||||
%button.dropdown-menu-toggle.js-label-select.js-multiselect{class: classes.join(' '), type: "button", data: dropdown_data}
|
%button.dropdown-menu-toggle.js-label-select.js-multiselect{class: classes.join(' '), type: "button", data: dropdown_data}
|
||||||
%span.dropdown-toggle-text
|
%span.dropdown-toggle-text{ class: ("is-default" if selected_toggle) }
|
||||||
= h(multi_label_name(selected_toggle || selected, "Label"))
|
= h(multi_label_name(selected_toggle || selected, "Label"))
|
||||||
= icon('chevron-down')
|
= icon('chevron-down')
|
||||||
.dropdown-menu.dropdown-select.dropdown-menu-paging.dropdown-menu-labels.dropdown-menu-selectable
|
.dropdown-menu.dropdown-select.dropdown-menu-paging.dropdown-menu-labels.dropdown-menu-selectable
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
- project = @target_project || @project
|
- project = @target_project || @project
|
||||||
- selected_text = project.milestones.find(selected).try(:name)
|
- selected_text = project.milestones.find_by_id(selected).try(:name)
|
||||||
- if selected.present?
|
- if selected.present?
|
||||||
= hidden_field_tag(name, selected)
|
= hidden_field_tag(name, selected)
|
||||||
= dropdown_tag(milestone_dropdown_label(selected_text), options: { title: "Filter by milestone", toggle_class: "js-milestone-select js-filter-submit #{extra_class}", filter: true, dropdown_class: "dropdown-menu-selectable",
|
= dropdown_tag(milestone_dropdown_label(selected_text), options: { title: "Filter by milestone", toggle_class: "js-milestone-select js-filter-submit #{extra_class}", filter: true, dropdown_class: "dropdown-menu-selectable",
|
||||||
|
|
Loading…
Reference in New Issue