Contrib.social

Improve the accessibility of the modal buttons

Open on Drupal.org →
Created on 9 May 2022, over 2 years ago
Updated 18 September 2024, 3 months ago

Problem/Motivation

To improve the accessibility of the modal close buttons it would be better if they were buttons with appropriate aria labels etc.

Currently, the close button looks like this:
<span class="class-modal-close spb_close">×</span>

Steps to reproduce

  1. Install and configure the modal
  2. Use the configured setup to visit the page where the modal should display
  3. Open the modal
  4. Inspect the code

Proposed resolution

Should be something like:
<button type='button' aria-label='close' class="class-modal-close spb_close">×</button>
This should work better for users who rely on the content being read out by a screen reader as the html will be more semantically correct.

Remaining tasks

Investigate the modal open and minimise buttons also.

User interface changes

Should display no differently for sighted users using a mouse.

API changes

None

Data model changes

Dom elements will change slightly.

✨ Feature request
Status

Fixed

Version

3.0

Component

Code

Created by

🇬🇧United Kingdom the_g_bomb

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

contrib.social Blog FAQ Discussions
Production build 0.71.5 2024