From e1ce90011399db27869046b9e6c8c3169ec932ad Mon Sep 17 00:00:00 2001
From: Pontoporeia <pontoporeia@happyngreen.fr>
Date: Thu, 2 Apr 2026 18:17:40 +0200
Subject: [PATCH] a11y: WCAG 2.5.5 target sizes + 2.5.3 label-in-name fixes
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Increase touch/click target sizes to meet WCAG 2.5.5 (minimum 44×44px
for navigation, 32px for admin UI controls):

- main.css / search.css: pagination buttons 2rem → min-height/min-width
  2.75rem (44px). Changed display to inline-flex for proper centering.
- admin.css: .admin-btn-sm gains min-height: 2rem (32px) and switches
  to inline-flex so the constraint is respected.
- admin.css: .admin-btn-remove (jury ✕ buttons) gains min-height: 2rem
  and inline-flex display + explicit cursor:pointer.

WCAG 2.5.3 label-in-name — jury remove buttons already had aria-label;
wrap the visible ✕ glyph in <span aria-hidden='true'> so screen readers
hear only the aria-label, not the symbol:

- templates/partials/form/jury-fieldset.php: all three ✕ occurrences
  (static PHP blocks + JS-generated innerHTML string) wrapped.

WCAG 4.1.2 / semantic HTML:
- admin/index.php: add role='toolbar' aria-label='Actions groupées' to
  the bulk-actions bar.
---
 public/admin/index.php                    |  2 +-
 public/assets/css/admin.css               | 10 ++++++++--
 public/assets/css/main.css                |  6 +++---
 public/assets/css/search.css              |  6 +++---
 templates/partials/form/jury-fieldset.php |  6 +++---
 todo/01-css-semantic-refactor.md          |  2 +-
 todo/04-accessibility.md                  | 12 ++++++------
 7 files changed, 25 insertions(+), 19 deletions(-)

diff --git a/public/admin/index.php b/public/admin/index.php
index ee3d59c..f6161a2 100644
--- a/public/admin/index.php
+++ b/public/admin/index.php
@@ -133,7 +133,7 @@ document.addEventListener('DOMContentLoaded', () => {
     </form>
 
     <!-- Bulk actions bar -->
-    <div id="bulk-actions" class="admin-bulk-actions">
+    <div id="bulk-actions" class="admin-bulk-actions" role="toolbar" aria-label="Actions groupées">
         <strong><span id="selected-count">0</span> TFE(s) sélectionné(s)</strong>
         <div class="admin-bulk-btns">
             <button type="button" class="admin-btn-sm admin-btn-publish" onclick="bulkAction('publish')">Publier</button>
diff --git a/public/assets/css/admin.css b/public/assets/css/admin.css
index ae1a64f..d3dace0 100644
--- a/public/assets/css/admin.css
+++ b/public/assets/css/admin.css
@@ -378,12 +378,14 @@
 
 .admin-btn-sm {
   padding: 0.25rem 0.6rem;
+  min-height: 2rem;    /* WCAG 2.5.5: ≥32px touch target */
   border-radius: 3px;
   font-size: 0.78rem;
   font-family: inherit;
   cursor: pointer;
   text-decoration: none;
-  display: inline-block;
+  display: inline-flex;
+  align-items: center;
   border: 1px solid transparent;
   transition: all 0.15s;
   white-space: nowrap;
@@ -591,9 +593,13 @@
     border: 1px solid var(--border-primary);
     color: #969696;
     border-radius: 3px;
-    padding: 0.2rem 0.45rem;
+    padding: 0.2rem 0.55rem;
+    min-height: 2rem;    /* WCAG 2.5.5: ≥32px touch target */
     font-size: 0.8rem;
     line-height: 1;
+    display: inline-flex;
+    align-items: center;
+    cursor: pointer;
   }
   .admin-btn-remove:hover {
     border-color: #e55;
diff --git a/public/assets/css/main.css b/public/assets/css/main.css
index 7c02689..59bca45 100644
--- a/public/assets/css/main.css
+++ b/public/assets/css/main.css
@@ -193,9 +193,9 @@
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  min-width: 2rem;
-  height: 2rem;
-  padding: 0 0.5rem;
+  min-width: 2.75rem;
+  min-height: 2.75rem;
+  padding: 0 0.6rem;
   border: 1px solid var(--border-secondary);
   border-radius: 3px;
   color: var(--text-primary);
diff --git a/public/assets/css/search.css b/public/assets/css/search.css
index 040cca5..fc51cc0 100644
--- a/public/assets/css/search.css
+++ b/public/assets/css/search.css
@@ -269,9 +269,9 @@
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  min-width: 2rem;
-  height: 2rem;
-  padding: 0 0.5rem;
+  min-width: 2.75rem;
+  min-height: 2.75rem;
+  padding: 0 0.6rem;
   border: 1px solid var(--border-secondary);
   border-radius: 3px;
   color: var(--text-primary);
diff --git a/templates/partials/form/jury-fieldset.php b/templates/partials/form/jury-fieldset.php
index b9080cd..6868328 100644
--- a/templates/partials/form/jury-fieldset.php
+++ b/templates/partials/form/jury-fieldset.php
@@ -65,7 +65,7 @@ $juryIdx = max(count($juryLecteurs), 1);
                                 <input type="checkbox" name="jury_lecteurs_ext[0]" value="1"> Externe
                             </label>
                             <button type="button" class="admin-btn-remove" onclick="removeJuryRow(this)"
-                                    aria-label="Supprimer ce lecteur">✕</button>
+                                    aria-label="Supprimer ce lecteur"><span aria-hidden="true">✕</span></button>
                         </div>
                         <?php else: ?>
                             <?php foreach ($juryLecteurs as $li => $lm): ?>
@@ -77,7 +77,7 @@ $juryIdx = max(count($juryLecteurs), 1);
                                            <?= $lm['is_external'] ? 'checked' : '' ?>> Externe
                                 </label>
                                 <button type="button" class="admin-btn-remove" onclick="removeJuryRow(this)"
-                                        aria-label="Supprimer ce lecteur">✕</button>
+                                        aria-label="Supprimer ce lecteur"><span aria-hidden="true">✕</span></button>
                             </div>
                             <?php endforeach; ?>
                         <?php endif; ?>
@@ -97,7 +97,7 @@ $juryIdx = max(count($juryLecteurs), 1);
                           + '<label class="admin-checkbox-label admin-jury-ext">'
                           + '<input type="checkbox" name="jury_lecteurs_ext[' + juryIdx + ']" value="1"> Externe'
                           + '</label>'
-                          + '<button type="button" class="admin-btn-remove" onclick="removeJuryRow(this)" aria-label="Supprimer ce lecteur">✕</button>';
+                          + '<button type="button" class="admin-btn-remove" onclick="removeJuryRow(this)" aria-label="Supprimer ce lecteur"><span aria-hidden="true">✕</span></button>';
             list.appendChild(div);
             juryIdx++;
         }
diff --git a/todo/01-css-semantic-refactor.md b/todo/01-css-semantic-refactor.md
index 56abf24..2b2fd1d 100644
--- a/todo/01-css-semantic-refactor.md
+++ b/todo/01-css-semantic-refactor.md
@@ -42,7 +42,7 @@
 - [ ] **`add.php`/`edit.php`**: Replace `<div class="admin-alert admin-alert--error/--success">` with `<p role="alert">` / `<p role="status">`
 - [ ] **`index.php`**: Replace `<div class="admin-stats">` / `<div class="admin-stat">` children with `<dl>/<dt>/<dd>`
 - [ ] **`index.php`**: Replace `<div class="admin-maintenance-bar">` with `<aside role="status">` or `<p role="status">`
-- [ ] **`index.php`**: Add `role="toolbar" aria-label="Actions groupées"` to `<div class="admin-bulk-actions">`
+- [x] **`index.php`**: Add `role="toolbar" aria-label="Actions groupées"` to `<div class="admin-bulk-actions">`
 - [ ] **`index.php`**: Add `scope="col"` to all `<th>` cells in the admin table
 - [ ] **`index.php`**: Add non-colour indicator + `aria-label="Statut : …"` to status badge `<span>` elements
 - [ ] **`tags.php`**: Add `scope="col"` to `<th>` cells
diff --git a/todo/04-accessibility.md b/todo/04-accessibility.md
index b92157c..7eb6380 100644
--- a/todo/04-accessibility.md
+++ b/todo/04-accessibility.md
@@ -2,7 +2,7 @@
 
 ## 1.1.1 Non-text content (alt text)
 
-- [ ] **Admin `<nav>` "✕ Réinitialiser" and "✕" remove buttons** — wrap `✕` in `<span aria-hidden="true">✕</span>`; add `aria-label="Supprimer ce membre du jury"` on jury remove buttons in `add.php`/`edit.php`
+- [x] **Admin `<nav>` "✕ Réinitialiser" and "✕" remove buttons** — wrap `✕` in `<span aria-hidden="true">✕</span>`; add `aria-label="Supprimer ce membre du jury"` on jury remove buttons in `add.php`/`edit.php`
 
 ## 1.3.1 Info and relationships
 
@@ -42,14 +42,14 @@
 
 ## 2.5.3 Label in name
 
-- [ ] **`<a class="clear-filter">✕ Réinitialiser</a>`** — wrap `✕` in `<span aria-hidden="true">`
-- [ ] **Admin jury remove buttons `✕`** — `aria-label="Supprimer ce lecteur"` replaces the symbol
+- [x] **`<a class="clear-filter">✕ Réinitialiser</a>`** — wrap `✕` in `<span aria-hidden="true">`
+- [x] **Admin jury remove buttons `✕`** — `aria-label="Supprimer ce lecteur"` replaces the symbol
 
 ## 2.5.5 Target size
 
-- [ ] **Pagination buttons are `2rem` (32px)** — increase to `min-height: 2.75rem; min-width: 2.75rem` (44px)
-- [ ] **Admin `.admin-btn-sm` (~28px)** — increase to minimum 32px with padding
-- [ ] **Admin bulk action buttons and jury remove `✕` buttons (~28px)** — increase target size
+- [x] **Pagination buttons are `2rem` (32px)** — increase to `min-height: 2.75rem; min-width: 2.75rem` (44px)
+- [x] **Admin `.admin-btn-sm` (~28px)** — increase to minimum 32px with padding
+- [x] **Admin bulk action buttons and jury remove `✕` buttons (~28px)** — increase target size
 
 ## 3.1.1 Language of page