ColumnSelect: hide group labels when filtering
This commit is contained in:
parent
eeadee2d5e
commit
5bfe289811
3 changed files with 7 additions and 2 deletions
|
@ -132,6 +132,7 @@ class App.ColumnSelect extends Spine.Controller
|
||||||
$(el).addClass('is-filtered')
|
$(el).addClass('is-filtered')
|
||||||
|
|
||||||
@clearButton.toggleClass 'is-hidden', filter.length is 0
|
@clearButton.toggleClass 'is-hidden', filter.length is 0
|
||||||
|
@pool.toggleClass 'filter-active', filter.length != 0
|
||||||
|
|
||||||
clear: ->
|
clear: ->
|
||||||
@search.val('')
|
@search.val('')
|
||||||
|
|
|
@ -34,7 +34,7 @@
|
||||||
<div class="columnSelect-pool js-pool">
|
<div class="columnSelect-pool js-pool">
|
||||||
<% for option in @attribute.options: %>
|
<% for option in @attribute.options: %>
|
||||||
<% if option.group != undefined: %>
|
<% if option.group != undefined: %>
|
||||||
<div class="columnSelect-divider" title="<%= option.label %>"><%= option.label %></div>
|
<div class="columnSelect-group-label" title="<%= option.label %>"><%= option.label %></div>
|
||||||
<% for o in option.group: %>
|
<% for o in option.group: %>
|
||||||
<div class="columnSelect-option js-select js-option<%= ' is-hidden' if o.selected %>" data-value="<%= o.value %>" title="<%= o.title %>"><%= o.name %></div>
|
<div class="columnSelect-option js-select js-option<%= ' is-hidden' if o.selected %>" data-value="<%= o.value %>" title="<%= o.title %>"><%= o.name %></div>
|
||||||
<% end %>
|
<% end %>
|
||||||
|
|
|
@ -10099,9 +10099,13 @@ output {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&-divider {
|
&-group-label {
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
|
|
||||||
|
.filter-active & {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
~ .columnSelect-option {
|
~ .columnSelect-option {
|
||||||
padding-left: 10px;
|
padding-left: 10px;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue