- This topic has 4 replies, 2 voices, and was last updated 4 years, 4 months ago by Tom.
-
AuthorPosts
-
November 11, 2019 at 2:01 pm #1059927Danny
The hamburger menu button is failing lighthouse accessibility. Any suggestions on how to fix this?
Failing Element:
button <button class="menu-toggle" aria-controls="mobile-menu" aria-expanded="false">
Copy of button code:
<button class="menu-toggle" aria-controls="mobile-menu" aria-expanded="false"> <span class="gp-icon icon-menu-bars"><svg viewBox="0 0 512 512" aria-hidden="true" role="img" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1em" height="1em"> <path d="M0 96c0-13.255 10.745-24 24-24h464c13.255 0 24 10.745 24 24s-10.745 24-24 24H24c-13.255 0-24-10.745-24-24zm0 160c0-13.255 10.745-24 24-24h464c13.255 0 24 10.745 24 24s-10.745 24-24 24H24c-13.255 0-24-10.745-24-24zm0 160c0-13.255 10.745-24 24-24h464c13.255 0 24 10.745 24 24s-10.745 24-24 24H24c-13.255 0-24-10.745-24-24z"></path> </svg><svg viewBox="0 0 512 512" aria-hidden="true" role="img" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1em" height="1em"> <path d="M71.029 71.029c9.373-9.372 24.569-9.372 33.942 0L256 222.059l151.029-151.03c9.373-9.372 24.569-9.372 33.942 0 9.372 9.373 9.372 24.569 0 33.942L289.941 256l151.03 151.029c9.372 9.373 9.372 24.569 0 33.942-9.373 9.372-24.569 9.372-33.942 0L256 289.941l-151.029 151.03c-9.373 9.372-24.569 9.372-33.942 0-9.372-9.373-9.372-24.569 0-33.942L222.059 256 71.029 104.971c-9.372-9.373-9.372-24.569 0-33.942z"></path> </svg></span> <span class="mobile-menu"></span> </button>
November 11, 2019 at 7:54 pm #1060069TomLead DeveloperLead DeveloperHi there,
We’ve actually addressed this in GP 2.4.0, which you can update to now if you’d like: https://generatepress.com/generatepress-2-4-0/
Let me know if you need more info 🙂
November 11, 2019 at 9:39 pm #1060097DannyHey Tom, I updated. I am still using a child theme for my custom css, should I remove this?
Also, can you point me in the right direction on how to rectify this accessibility issue?
November 11, 2019 at 10:15 pm #1060109DannyI didn’t see anything I could edit . I’m getting accessibility score of 97, prior it was 84. Getting a warning on contrast of buttons.
November 12, 2019 at 8:56 am #1060831TomLead DeveloperLead DeveloperYou likely still need your custom CSS (depending on what it is).
The update fixed that issue automatically, so there’s nothing else for you to do there.
Button contrast is something you can address by tweaking your buttons colors (background and text).
-
AuthorPosts
- You must be logged in to reply to this topic.