Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
zulip/web/templates/popovers/navbar/navbar_help_menu_popover.hbs

44 lines
2.7 KiB
Handlebars
Raw Normal View History

scroll: Set tabIndex to -1 for simplebar content wrapper. Fixes #30403. Having tabIndex set to 0 led to keyboard focus being put on a scrollbar container, which led to users having to tab twice to skip a container. This commit also removes instances of tabIndex being set to -1 programatically for certain cases, since it is -1 by default now. This commit also removes `outline: none` for simplebar since that property is not needed anymore because the wrapper is not focusable anymore.
2024-06-16 13:46:37 +02:00
<div class="popover-menu" id="help-menu-dropdown" aria-labelledby="help-menu" data-simplebar data-simplebar-tab-index="-1">
help_menu_popover: Flatten nested lists for better accessibility. This refactors popover list structure to use a flattened `ul > li` structure along with aria-related additions, enabling screen reader accessibility and announcing menu length and position (`# of n`). Added ARIA roles: - `role="menu"` to the parent `<ul>` element, indicating it is a widget offering a list of choices. - `role="menuitem"`, `role="menuitemcheckbox"`, or`role="menuitemradio"` to child elements based on their function. - `role="none"` to `<li>` elements, removing the implied `listitem` role that conflicts with the parent menu structure.
2024-05-24 08:40:15 +02:00
<ul role="menu" class="popover-menu-list">
<li role="none" class="link-item popover-menu-list-item">
<a role="menuitem" href="/help/" target="_blank" rel="noopener noreferrer" class="navigate-link-on-enter popover-menu-link">
<i class="popover-menu-icon zulip-icon zulip-icon-help" aria-hidden="true"></i>
<span class="popover-menu-label">{{t 'Help center' }}</span>
</a>
help_menu: Extract help items from gear menu into a separate popover. Fixes #27202
2023-10-21 13:57:36 +02:00
</li>
help_menu_popover: Flatten nested lists for better accessibility. This refactors popover list structure to use a flattened `ul > li` structure along with aria-related additions, enabling screen reader accessibility and announcing menu length and position (`# of n`). Added ARIA roles: - `role="menu"` to the parent `<ul>` element, indicating it is a widget offering a list of choices. - `role="menuitem"`, `role="menuitemcheckbox"`, or`role="menuitemradio"` to child elements based on their function. - `role="none"` to `<li>` elements, removing the implied `listitem` role that conflicts with the parent menu structure.
2024-05-24 08:40:15 +02:00
<li role="none" class="link-item popover-menu-list-item">
<a role="menuitem" tabindex="0" class="navigate-link-on-enter popover-menu-link" data-overlay-trigger="keyboard-shortcuts">
<i class="popover-menu-icon zulip-icon zulip-icon-keyboard" aria-hidden="true"></i>
<span class="popover-menu-label">{{t 'Keyboard shortcuts' }}</span>
{{popover_hotkey_hints "?"}}
</a>
</li>
<li role="none" class="link-item popover-menu-list-item hidden-for-spectators">
<a role="menuitem" tabindex="0" class="navigate-link-on-enter popover-menu-link" data-overlay-trigger="message-formatting">
<i class="popover-menu-icon zulip-icon zulip-icon-edit" aria-hidden="true"></i>
<span class="popover-menu-label">{{t 'Message formatting' }}</span>
</a>
</li>
<li role="none" class="link-item popover-menu-list-item">
<a role="menuitem" tabindex="0" class="navigate-link-on-enter popover-menu-link" data-overlay-trigger="search-operators">
<i class="popover-menu-icon zulip-icon zulip-icon-manage-search" aria-hidden="true"></i>
<span class="popover-menu-label">{{t 'Search filters' }}</span>
</a>
</li>
<li role="none" class="link-item popover-menu-list-item" id="gear_menu_about_zulip">
<a role="menuitem" href="#about-zulip" class="navigate-link-on-enter popover-menu-link">
popovers: Add the missing aria-hidden attribute to popover icons. Some of the popover icons were missing the aria-hidden attribute, which caused them to be read out by screen readers.
2024-05-28 10:49:31 +02:00
<i class="popover-menu-icon zulip-icon zulip-icon-info" aria-hidden="true"></i>
help_menu_popover: Flatten nested lists for better accessibility. This refactors popover list structure to use a flattened `ul > li` structure along with aria-related additions, enabling screen reader accessibility and announcing menu length and position (`# of n`). Added ARIA roles: - `role="menu"` to the parent `<ul>` element, indicating it is a widget offering a list of choices. - `role="menuitem"`, `role="menuitemcheckbox"`, or`role="menuitemradio"` to child elements based on their function. - `role="none"` to `<li>` elements, removing the implied `listitem` role that conflicts with the parent menu structure.
2024-05-24 08:40:15 +02:00
<span class="popover-menu-label">{{t "About Zulip" }}</span>
</a>
</li>
{{#if corporate_enabled}}
<li role="none" class="link-item popover-menu-list-item">
<a role="menuitem" href="/help/contact-support" target="_blank" rel="noopener noreferrer" class="navigate-link-on-enter popover-menu-link">
<i class="popover-menu-icon zulip-icon zulip-icon-life-buoy" aria-hidden="true"></i>
<span class="popover-menu-label">{{t 'Contact support' }}</span>
</a>
</li>
{{/if}}
help_menu: Extract help items from gear menu into a separate popover. Fixes #27202
2023-10-21 13:57:36 +02:00
</ul>
</div>