Skip to content

Modified hamburger-nav.html, hamburger-nav.js#6151

Merged
t-will-gillis merged 1 commit intohackforla:gh-pagesfrom
robertnjenga:fix-accessibility-navmenu-4301
Jan 28, 2024
Merged

Modified hamburger-nav.html, hamburger-nav.js#6151
t-will-gillis merged 1 commit intohackforla:gh-pagesfrom
robertnjenga:fix-accessibility-navmenu-4301

Conversation

@robertnjenga
Copy link
Member

Fixes #4301

What changes did you make?

  • Added appropriate ARIA tags to the mobile "hamburger" icon/button and the mobile popup menu.
  • Added functionality to dynamically assign the aria-expanded attribute to indicate when the menu is in the hidden vs the expanded state.

Why did you make the changes (we will use this info to test)?

  • In order to enable use by AT (Assistive Technologies) such as screen readers.

Screenshots of Proposed Changes Of The Website (if any, please do not screen shot code changes)

  • No Visual Changes

@github-actions
Copy link

Want to review this pull request? Take a look at this documentation for a step by step guide!

From your project repository, check out a new branch and test the changes.

git checkout -b robertnjenga-fix-accessibility-navmenu-4301 gh-pages
git pull https://github.com/robertnjenga/website.git fix-accessibility-navmenu-4301

Note that CONTRIBUTING.md cannot previewed locally; rather it should be previewed at this URL:

https://github.com/robertnjenga/website/blob/fix-accessibility-navmenu-4301/CONTRIBUTING.md  

@github-actions github-actions bot added role: front end Tasks for front end developers Complexity: Large Feature: Accessibility Issues that would broaden website accessibility size: 2pt Can be done in 7-12 hours labels Jan 24, 2024
@chelseyklein
Copy link
Member

Review ETA: 10 PM 1/26/24
Availability: 3-8 PM M-F

@chelseyklein chelseyklein self-requested a review January 27, 2024 05:57
Copy link
Member

@chelseyklein chelseyklein left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great work, @robertnjenga!

  • The branch is correct and issue is linked
  • I've reviewed the issue and tested in Firefox, Chrome, and Safari on MacOS using voiceover. The changes work great and follow the requirements specified in the issue. 🤩

@freaky4wrld freaky4wrld self-requested a review January 28, 2024 04:40
@freaky4wrld
Copy link
Member

ETA: EoD 1/28/24
Availability: Evenings

Copy link
Member

@freaky4wrld freaky4wrld left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@robertnjenga thanks for taking up the issue, here are my observations:

  • the to/from branch is correct
  • the linked issue is correct as well
  • the changes done are mentioned along with the reason to make those changes
  • the testing info is also provided
  • on testing the changes locally, the AT are able to access the hamburger-menu-item as required and specified
  • I have tested the changes in Safari and Chrome on MacOS....

PR approved!!!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Complexity: Large Feature: Accessibility Issues that would broaden website accessibility role: front end Tasks for front end developers size: 2pt Can be done in 7-12 hours

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Fix accessibility problems in the mobile navigation menu

4 participants