{% extends 'patterns/organisms/header/elections/simple_header.html' %}

{% block after_description %}
  <div
    class="
      container--medium flex justify-start !pl-[unset] !pr-[unset] !ml-[unset] !mr-[unset]
      xl:mb-12 mb-4
    "
  >
    <ui-horizontal-scrollable
      classes="switch overflow-x-scroll flex gap-2 w-[calc(100vw_-_3rem)] lg:w-[unset]"
      scroller-classes="!text-black"
      arrow-position="bottom"
    >
      {% block switch %}
        {% for switch in ui_switch_iterable %}
          <a
            @click="toggleView('view{{ forloop.counter }}')"
            class="switch__item--elections"
            :class="{'switch__item--active': isCurrentView('view{{ forloop.counter }}')}"
          >{{ switch.name }}</a>
        {% endfor %}
      {% endblock %}
    </ui-horizontal-scrollable>
  </div>
{% endblock %}
