search

ifmeorg / ifme

Free, open source mental health communication web app to share experiences with loved ones
http://www.if-me.org/
GNU Affero General Public License v3.0
1.46k stars 734 forks source link

Fix keyboard navigation for navigation menu in mobile web #2159

Closed julianguyen closed 1 year ago

julianguyen commented 1 year ago

Description

There are two issues with the keyboard navigation for the navigation menu in mobile web:

  1. When a user uses the Tab key to navigate through a page, the navigation menu is opened. It should only be opened after the Tab key focuses on the hamburger icon and the user hits the Enter key to open it.
  2. There is no focus trap on the navigation menu when it's opened (as a modal)

The following recent PR for "[FIX] Keyboard navigation for modals" by @maniSHarma7575 fixed the issue in other areas. So you'll want to dig deeper into this part of the codebase as to why it's not working for the navigation menu in mobile web.

This navigation menu is part of the Header component.

Oct-08-2022 08-12-57

Please assign yourself (via the Assignees dropdown), if you do want to work on this issue. Can't find yourself? You need to join our organization.

Check out our Picking Up Issues guide if you haven't already!