Skip to content
This repository has been archived by the owner on Feb 24, 2023. It is now read-only.

Custom arrows / nav buttons accessibility. #181

Open
angust opened this issue Jul 2, 2020 · 1 comment
Open

Custom arrows / nav buttons accessibility. #181

angust opened this issue Jul 2, 2020 · 1 comment

Comments

@angust
Copy link

angust commented Jul 2, 2020

It would be great to be able to pass aria-labels, titles and alt text to the slots for prevButton & nextButton to help with accessibility.

Currently, Buttons do not have an accessible name in the DOM they're simply rendered as:

<button type="button" class="agile__nav-button agile__nav-button--prev">custom content</div>
Maybe if this isn't customizable there should be some generic 'previous slide' / 'next slide' descriptors labels for the buttons.

An example could look like:
<button type="button" class="agile__nav-button agile__nav-button--prev" aria-label="Previous Slide">
There's also some recommendations for markup solutions here: https://dequeuniversity.com/rules/axe/3.3/button-name

@issue-label-bot
Copy link

Issue-Label Bot is automatically applying the label feature request to this issue, with a confidence of 0.94. Please mark this comment with 👍 or 👎 to give our bot feedback!

Links: app homepage, dashboard and code for this bot.

@lukaszflorczak lukaszflorczak added this to In progress in 🛠 TO DO Dec 8, 2021
@lukaszflorczak lukaszflorczak moved this from In progress to To do in 🛠 TO DO Dec 8, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
Development

No branches or pull requests

1 participant