Skip to content
Snippets Groups Projects
Commit 8beed159 authored by Ivica Puljic's avatar Ivica Puljic
Browse files

Issue #3472681 by pivica: Language switcher accessibility issues: unique ARIA...

Issue #3472681 by pivica: Language switcher accessibility issues: unique ARIA IDs, aria role mismatch
parent 0249f3ed
No related branches found
No related tags found
1 merge request!4Issue #3472681 by pivica: Language switcher accessibility issues: unique ARIA...
......@@ -474,6 +474,7 @@ function bs_bootstrap_preprocess_links(&$variables) {
// @todo - can we do this in template?
foreach ($variables['links'] as &$link) {
$link['link']['#options']['attributes']['class'][] = 'dropdown-item';
$link['link']['#options']['attributes']['role'] = 'menuitem';
}
// Set the active language native label and class.
......
......@@ -32,19 +32,22 @@
*/
#}
{% set classes = classes|default(['dropdown', 'dropdown-language']) %}
{% set id = 'languageDropdownMenu'|clean_unique_id %}
{% set button_attributes = create_attribute({
'class': ['btn', 'btn-secondary', 'dropdown-toggle'],
'type': 'button',
'id': 'languageDropdownMenu',
'data-toggle': 'dropdown',
'aria-controls': 'menu',
'aria-haspopup': 'true',
'aria-expanded': 'false',
'aria-label': 'Change website language (current %language)'|t({'%language': active_language_name}, {}),
'aria-expanded': 'false',
'class': ['btn', 'btn-secondary', 'dropdown-toggle'],
'id': id,
'data-toggle': 'dropdown',
'title': 'Change website language'|t,
'type': 'button',
}) %}
{% set dropdown_menu_attributes = create_attribute({
'aria-labelledby': id,
'class': ['dropdown-menu', 'dropdown-menu-right'],
'aria-labelledby': 'languageDropdownMenu',
'role': 'menu',
}) %}
{% block dropdown -%}
<div{{ attributes.addClass(classes) }}>
......@@ -53,18 +56,18 @@
{%- endblock -%}
{%- block menu -%}
{%- if links -%}
<div {{ dropdown_menu_attributes }}>
<ul {{ dropdown_menu_attributes }}>
<div class="dropdown-header">{{ 'Language'|t }}</div>
{%- for item in links -%}
{%- if item.link -%}
{{ item.link }}
<li>{{ item.link }}</li>
{%- elseif item.text_attributes -%}
<span{{ item.text_attriutes.addClass('dropdown-item') }}>{{ item.text }}</span>
<li><span{{ item.text_attriutes.addClass('dropdown-item') }}>{{ item.text }}</span></li>
{%- else -%}
{{ item.text }}
{%- endif -%}
{%- endfor -%}
</div>
</ul>
{%- endif -%}
{%- endblock -%}
</div>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment