<section role="main">

  <div class="wrap row">
    <div id="debates" class="debates-list small-12 medium-9 column js-order-<%= @order.dasherize %>">
      <div class="filters">
        <div class="small-12 medium-8 column">
          <% if @search_terms %>
              <h2>
                <%= page_entries_info @debates %>
                <%= t("debates.index.search_results", count: @debates.size, search_term: @search_terms) %>
              </h2>
          <% elsif @tag_filter %>
              <h2>
                <%= page_entries_info @debates %>
                <%= t("debates.index.filter_topic", count: @debates.size, topic: @tag_filter) %>
              </h2>
          <% end %>
        </div>
        <div class="inline-block <%= 'right' if (@tag_filter || @search_terms) %>">
            <% if @tag_filter || @search_terms %>
              <h6 class="inline-block">
                <%= t("debates.index.select_order") %>
              </h6>
            <% else %>
              <h2 class="inline-block">
                <%= t("debates.index.select_order_long") %>
              </h2>
            <% end %>
          <form class="inline-block">
             <select class="js-location-changer" name="order-selector">
               <% @valid_orders.each do |order| %>
                 <option <%= 'selected' if order == @order %>
                         value='<%= current_path_with_query_params(order: order) %>'>
                   <%= t("debates.index.orders.#{order}") %>
                 </option>
               <% end %>
             </select>
          </form>
        </div>
      </div>
      <div class="show-for-small-only">
        <%= link_to t("debates.index.start_debate"), new_debate_path, class: 'button radius expand' %>
      </div>
      <%= render @debates %>
      <%= paginate @debates %>
    </div>
    <div class="small-12 medium-3 column">
      <aside class="sidebar" role="complementary">
        <%= link_to t("debates.index.start_debate"), new_debate_path, class: 'button radius expand' %>
        <%= render "shared/tag_cloud" %>
      </aside>
    </div>
  </div>
</section>
