fix: add dialog semantics and accessible close button to update source modal (#58)

Addresses PR #18 review feedback (issue #22):
- Add role="dialog", aria-modal="true", aria-labelledby to modal container
- Add tabindex="-1" to make modal keyboard-focusable
- Add unique id to <h2> heading for aria-labelledby reference
- Replace <span class="wpst-modal-close"> with <button type="button"> and aria-label

Fixes #22
This commit is contained in:
2026-03-16 23:08:09 +00:00
committed by GitHub
parent a6db436a48
commit 1d41af86c3

View File

@@ -12,11 +12,22 @@ if ( ! defined( 'ABSPATH' ) ) {
?> ?>
<!-- Update Source Modal --> <!-- Update Source Modal -->
<div id="wpst-update-source-modal" class="wpst-modal" role="dialog" aria-modal="true" aria-labelledby="wpst-modal-title"> <div
id="wpst-update-source-modal"
class="wpst-modal"
role="dialog"
aria-modal="true"
aria-labelledby="wpst-update-source-modal-title"
tabindex="-1"
>
<div class="wpst-modal-content"> <div class="wpst-modal-content">
<div class="wpst-modal-header"> <div class="wpst-modal-header">
<h2 id="wpst-modal-title" class="wpst-modal-title"><?php esc_html_e( 'Select Update Source', 'wp-plugin-starter-template' ); ?></h2> <h2 id="wpst-update-source-modal-title" class="wpst-modal-title"><?php esc_html_e( 'Select Update Source', 'wp-plugin-starter-template' ); ?></h2>
<button type="button" class="wpst-modal-close" aria-label="<?php esc_attr_e( 'Close', 'wp-plugin-starter-template' ); ?>">&times;</button> <button
type="button"
class="wpst-modal-close"
aria-label="<?php esc_attr_e( 'Close dialog', 'wp-plugin-starter-template' ); ?>"
>&times;</button>
</div> </div>
<div class="wpst-modal-body"> <div class="wpst-modal-body">