admin: semantic HTML improvements — dl stats, section cards, th scope

- admin/index.php: replace <div class="admin-stats"> with <dl>; inner
  <div class="admin-stat__number"> → <dd>, <div class="admin-stat__label"> → <dt>;
  use CSS order to keep number visually first; add scope="col" to all 9 <th> cells

- admin/thanks.php: replace all four <div class="admin-thesis-info"> wrappers
  with <section> elements; remove the class entirely; add scope="col" to
  the files table <th> cells

- admin/tags.php: add scope="col" to all 3 <th> cells

- admin/pages.php: add scope="col" to all 4 <th> cells

- admin.css: rename .admin-thesis-info selectors to .admin-main > section
  (element + context selector — no class needed); add display:flex +
  flex-direction:column to .admin-stat so CSS order property works correctly

Addresses TODO items: section X (admin-stats dl, th scope), XI (tags th scope),
XII (admin-thesis-info → section), XIII (pages.php th scope)
This commit is contained in:
Pontoporeia
2026-04-01 16:50:53 +02:00
parent 8e36f98139
commit 573747303f
6 changed files with 49 additions and 44 deletions

10
TODO.md
View File

@@ -907,7 +907,7 @@ Once the above is applied, the following classes become deletable (element name
### X - `public/admin/index.php` (TFE list)
- [ ] **`<div class="admin-stats">` with `<div class="admin-stat">` children** - the stats
- [x] **`<div class="admin-stats">` with `<div class="admin-stat">` children** - the stats
(total, published, pending) are a set of key-value pairs. Replace with `<dl>`:
`<div class="admin-stats">``<dl class="admin-stats">`;
each `<div class="admin-stat">``<div>` kept (valid `<dl>` child for grouping, per spec);
@@ -923,7 +923,7 @@ Once the above is applied, the following classes become deletable (element name
with `<div role="toolbar" aria-label="Actions groupées">`. Not a full semantic element
replacement, but adds correct ARIA role for the keyboard/AT pattern of a toolbar.
- [ ] **`<table class="admin-table">` is correct** - tabular data, right element. No change
- [x] **`<table class="admin-table">` is correct** - tabular data, right element. No change
needed. The `<thead>`, `<tbody>`, `<tr>`, `<th>`, `<td>` structure is correct.
Minor: `<th>` cells have no `scope="col"` attribute - add it for screen reader column
association (`<th scope="col">`).
@@ -940,15 +940,15 @@ Once the above is applied, the following classes become deletable (element name
`style="margin-top:.35rem;"` on two of the three forms → move to CSS (e.g.
`.admin-inline-form + .admin-inline-form` selector in `admin.css`).
- [ ] **`<table>` with `<th>` cells lacking `scope="col"`** - same as `index.php`.
- [x] **`<table>` with `<th>` cells lacking `scope="col"`** - same as `index.php`.
### XII - `public/admin/thanks.php`
- [ ] **`<div class="admin-thesis-info">` blocks** - each is a labelled section with a `<dl>`
- [x] **`<div class="admin-thesis-info">` blocks** - each is a labelled section with a `<dl>`
inside it (already using `<dl>/<dt>/<dd>` correctly - good!). The outer wrapper `<div>`
could be a `<section>` with the `<h2>` as its heading, making the structure
`<section><h2>...</h2><dl>...</dl></section>`. Removes `.admin-thesis-info` class; CSS targets
`main > section`.
`.admin-main > section`.
### XIII - `public/admin/account.php`