<div class="search-panel__filter-wrapper small flex flex--verticalCenter">
  <div class="balloon-wrapper search-panel__filter mg-r-1">
    <a class="button button--text button--dropmenu filter-bar__button--text button--small pd-l-0" data-filter="type" {{action 'setFilter' 'type'}}>
      {{i18n filterOptions.type}}
      <div class="balloon balloon--down balloon--left balloon--dropmenu balloon--no-tail {{if (eq currentFilter 'type') 'show' 'hide'}}">
        <ul class="balloon__list">
          {{#each typeOptions as |type|}}
            <li><a class="balloon__link" {{action 'updateOption' 'type' type}}>{{i18n type}}</a></li>
          {{/each}}
        </ul>
      </div>
    </a>
  </div>

  <div class="balloon-wrapper search-panel__filter mg-r-1 flex__item--grow">
    <a class="button button--text button--dropmenu filter-bar__button--text button--small pd-l-0" data-filter="duration" {{action 'setFilter' 'duration'}}>
      {{i18n filterOptions.duration}}
      <div class="balloon balloon--down balloon--left balloon--dropmenu balloon--no-tail {{if (eq currentFilter 'duration') 'show' 'hide'}}">
        <ul class="balloon__list">
          {{#each durationOptions as |duration|}}
            <li><a class="balloon__link" {{action 'updateOption' 'duration' duration}}>{{i18n duration}}</a></li>
          {{/each}}
        </ul>
      </div>
    </a>
  </div>

  <div class="balloon-wrapper search-panel__filter">
    <a class="button button--text button--dropmenu filter-bar__button--text button--small pd-l-0" data-filter="sort" {{action 'setFilter' 'sort'}}>
      {{i18n filterOptions.sort}}
      <div class="balloon balloon--down balloon--left balloon--dropmenu balloon--no-tail {{if (eq currentFilter 'sort') 'show' 'hide'}}">
        <ul class="balloon__list">
          {{#each sortOptions as |sort|}}
            <li><a class="balloon__link" {{action 'updateOption' 'sort' sort}}>{{i18n sort}}</a></li>
          {{/each}}
        </ul>
      </div>
    </a>
  </div>
</div>
