Skip to content

Commit 4fe9cd4

Browse files
fix(website): fix website aria violation (#4148)
resolves #2729 ## Summary - clean up ARIA label usage in the hamburger menu icon - add explicit aria labels to menu toggle buttons 🚀 Preview: Add `preview` label to enable
1 parent b8591d5 commit 4fe9cd4

2 files changed

Lines changed: 7 additions & 2 deletions

File tree

website/src/components/Navigation/SandwichMenu.tsx

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,11 @@ export const SandwichMenu: FC<SandwichMenuProps> = ({ topNavigationItems, gitHub
1717
return (
1818
<div className='relative'>
1919
{!isOpen ? (
20-
<button className='absolute z-50 bg-transparent border-none cursor-pointer' onClick={toggleMenu}>
20+
<button
21+
className='absolute z-50 bg-transparent border-none cursor-pointer'
22+
onClick={toggleMenu}
23+
aria-label='Open main menu'
24+
>
2125
<SandwichIcon isOpen={isOpen} />
2226
</button>
2327
) : (
@@ -32,6 +36,7 @@ export const SandwichMenu: FC<SandwichMenuProps> = ({ topNavigationItems, gitHub
3236
<button
3337
className='absolute z-50 bg-transparent border-none cursor-pointer right-3 top-4'
3438
onClick={toggleMenu}
39+
aria-label='Close main menu'
3540
>
3641
<SandwichIcon isOpen={isOpen} />
3742
</button>

website/src/components/SandwichIcon.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ const styledHamburger = `
4545

4646
export const SandwichIcon: FC<{ isOpen: boolean }> = ({ isOpen }) => {
4747
return (
48-
<div className='relative' aria-label='main menu'>
48+
<div className='relative'>
4949
<div className='hamburger'>
5050
<div className={`burger bg-primary-600 burger1--${isOpen ? 'open' : 'closed'}`} />
5151
<div className={`burger bg-primary-600 burger2--${isOpen ? 'open' : 'closed'}`} />

0 commit comments

Comments
 (0)