vue-agile icon indicating copy to clipboard operation
vue-agile copied to clipboard

Custom arrows / nav buttons accessibility.

Open angust opened this issue 4 years ago • 1 comments

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

angust avatar Jul 02 '20 05:07 angust

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

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

issue-label-bot[bot] avatar Jul 02 '20 05:07 issue-label-bot[bot]