Something went wrong on our end
-
Eric Bremner authored
ISTWCMS-4704: updating tabs to now have a just buttons option and to all for button specific classes
Eric Bremner authoredISTWCMS-4704: updating tabs to now have a just buttons option and to all for button specific classes
_tabs.twig 2.02 KiB
<div class="uw-tabs{% if tabs_modifier_class %} {{ tabs_modifier_class }}{% endif %}">
<div class="uw-tab" role="tablist" aria-label="Multi-tab-list">
{% for type in content_list %}
{% if tab_type == "link" %}
<a href="{{ type.url }}" class="uw-tablinks {{ button_modifier_classes }}{% if type.active %} active{% endif %}">{{ type.text }}</a>
{% elseif tab_type == "button" %}
{% set button_class -%}
uw-tablinks {{ button_modifier_classes }}{% if type.button_class %} {{ type.button_class }}{% endif %}
{%- endset %}
<button class="{{ button_class }}">{{ type.text }}</button>
{% else %}
{% set button_class -%}
uw-tablinks {{ button_modifier_classes }}{% if type.button_class %} {{ type.button_class }}{% endif %}
{%- endset %}
<button role="tab" class="{{ button_class }}" {% if loop.index == 1 %} aria-selected="true" {% else %} aria-selected="false" {% endif %} aria-controls="{{ type }}" id="tab-{{ loop.index }}" tabindex="0">{{ type }}</button>
{% endif %}
{% endfor %}
</div>
{% if tab_type == "content" %}
{% for type in content_list %}
<h2 class="hide-js"> {{ type }}</h2>
<div id="{{ type }}" class="uw-tabcontent" role="tabpanel" tabindex="0" aria-labelledby="tab-{{ loop.index }}" {% if loop.index > 1 %} hidden {% endif %} >
{% if loop.index == 1 %}
{% block content_area_1 %}
Content area 1
{% endblock %}
{% elseif loop.index == 2 %}
{% block content_area_2 %}
Content area 2
{% endblock %}
{% elseif loop.index == 3 %}
{% block content_area_3 %}
Content area 3
{% endblock %}
{% elseif loop.index == 4 %}
{% block content_area_4 %}
Content area 4
{% endblock %}
{% elseif loop.index == 5 %}
{% block content_area_5 %}
Content area 5
{% endblock %}
{% endif %}
</div>
{% endfor %}
{% endif %}
</div>