PostERG/xamxam
1
0
Fork 0
mirror of https://codeberg.org/PostERG/xamxam.git synced 2026-05-06 19:19:19 +02:00
Code Issues Packages Projects Releases Wiki Activity
Files
c2eff757897bb9a3bb0d5f1967c70d26e82db0ee
xamxam/todo/01-css-semantic-refactor.md
Pontoporeia 6e68edfbff Fix WCAG 4.1.2 truncated select text + split admin/public favicons 
- admin/edit.php: remove mb_strimwidth(60) truncation from access_type
  <select> option labels; full 'name — description' text is now the
  accessible name so screen readers get unambiguous option text (WCAG 4.1.2)

- public/assets/favicon.svg: new public favicon — brand-purple (#9557b5)
  rounded square with white 'P' lettermark; distinct from admin_favicon.svg
  (archive-restore Lucide icon in #c104fc) which is admin-only

- templates/head.php: favicon <link> now conditionally serves favicon.svg
  (public pages) or admin_favicon.svg (admin pages) based on $isAdmin;
  closes the open favicon task in todo/01-css-semantic-refactor.md

- todo/04-accessibility.md: mark WCAG 3.1.1 lang audit and WCAG 4.1.2
  select truncation items as done
- todo/01-css-semantic-refactor.md: mark favicon task as done
2026-04-06 15:33:08 +02:00

59 lines
5.6 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# CSS & Semantic HTML Refactor
## CSS class audit: replace with semantic selectors (`admin.css` / `main.css` / `tfe.css` / `search.css`)
- [x] **`admin.css`**: Replace `.admin-main` with `.admin-body main` — already done; CSS uses `.admin-body main`
- [x] **`admin.css`**: Replace `.admin-page-title` with `.admin-body main > h1` — already done; CSS uses `.admin-body main > h1`
- [x] **`admin.css`**: Replace `.admin-alert` / `.admin-alert--error` / `.admin-alert--success` with `[role="alert"]` / `data-type="error|success"` attribute
- [x] **`admin.css`**: Replace `.admin-form-row` with `.admin-body form > div` — already done; CSS uses `.admin-form > div:not(.admin-form-footer)` grid pattern
- [x] **`admin.css`**: Replace `.admin-label` with `.admin-body form label` — already done; CSS uses `.admin-form > div > label`
- [x] **`admin.css`**: Replace `.admin-input` / `.admin-select` / `.admin-textarea` with native element selectors — already done; CSS targets native `input`, `select`, `textarea` inside `.admin-form`
- [x] **`admin.css`**: Replace `.admin-hint` with `.admin-body form small`
- [x] **`admin.css`**: Replace `.admin-table` with `.admin-body table` — already done; CSS uses `.admin-body table`
- [x] **`admin.css`**: Replace `.admin-fieldset` / `.admin-fieldset-legend` with `.admin-body fieldset` / `.admin-body legend` — already done; CSS uses `.admin-body fieldset` and `.admin-body legend`
- [x] **`main.css`**: Replace `.card__caption` with `.home-body .cards-container li p` or `li > a > p`
- [x] **`main.css`**: Replace `.card__media` with `.home-body figure`
- [x] **`tfe.css`**: Replace `.tfe-meta-list` selectors with `article dl`, `article dt`, `article dd` — already done
- [x] **`tfe.css`**: Replace `.tfe-media-block` with `aside figure` — already done
- [x] **`tfe.css`**: Replace `.tfe-file-caption` with `aside figcaption` — already done
- [x] **`search.css`**: Replace `.repertoire-col > h2` — already uses `.repertoire-index section > h2`
- [x] **`system.php`**: Move inline `<style>` block to `system.css`
## Template HTML changes to match
- [x] In all admin templates, replace `<p class="admin-hint">` with `<small>` elements — already done; partials emit `<small>` directly
- [x] In `tfe.php`, remove `class="tfe-meta-list"` — target via `article dl`
- [x] In `tfe.php`, remove `class="tfe-media-block"` — target via `aside figure`
- [x] In `tfe.php`, remove `class="tfe-file-caption"` — target via `aside figcaption`
- [x] In `index.php`, remove `class="card__caption"` — target via `li > a > p`
## Scattered inline styles in templates
- [x] `tfe.php` inline styles — already extracted (no `style=` attributes remain in `public/tfe.php`)
- [x] `admin/edit.php`: multiple `style=` on `.admin-form-row` and banner preview → modifier classes in `admin.css` — already done; no `style=` attributes remain in `edit.php`
## Admin semantic HTML (sections IX–XVI)
- [x] **`add.php`/`edit.php`**: Replace `<div class="admin-form-row">` with CSS grid on `<form>` children — already done via form partials; rows are bare `<div>` inside `.admin-form`
- [x] **`add.php`/`edit.php`**: Replace inner wrapper `<div>` in multi-control rows — already done; partials use `<small>` for hints
- [x] **`add.php`/`edit.php`**: Replace `<div class="admin-checkbox-list">` with `<ul>`; each `<label class="admin-checkbox-label">` becomes `<li>` containing `<label>`
- [x] **`add.php`/`edit.php`**: Renamed `<div class="admin-submit-wrap">` → `<div class="admin-form-footer">` in all 6 admin templates (`add.php`, `edit.php`, `login.php`, `account.php`, `import.php`, `pages-edit.php`) and updated all 8 CSS selectors in `admin.css` — `.admin-form > div:not(.admin-form-footer)`, `.admin-login-box .admin-form-footer`, etc.
- [x] **`add.php`/`edit.php`**: Replace `<div class="admin-alert admin-alert--error/--success">` with `<p role="alert">` / `<p role="status">` — already done via `flash-messages.php`
- [x] **`index.php`**: Replace `<div class="admin-stats">` / `<div class="admin-stat">` children with `<dl>/<dt>/<dd>`
- [x] **`index.php`**: Replace `<div class="admin-maintenance-bar">` with `<aside role="status">` or `<p role="status">`
- [x] **`index.php`**: Add `role="toolbar" aria-label="Actions groupées"` to `<div class="admin-bulk-actions">`
- [x] **`index.php`**: Add `scope="col"` to all `<th>` cells in the admin table
- [x] **`index.php`**: Add non-colour indicator + `aria-label="Statut : …"` to status badge `<span>` elements (via `status-badge.php` partial)
- [x] **`tags.php`**: Add `scope="col"` to `<th>` cells
- [x] **`tags.php`**: Move inline `style="margin-top:.35rem;"` on forms → `.admin-inline-form + .admin-inline-form` selector
- [x] **`thanks.php`**: Replace `<div class="admin-thesis-info">` with `<section>` + `<h2>` heading; CSS targets `main > section`
- [x] **`account.php`**: Replace `<div class="admin-account-status">` with `<dl>`; `__row` → `<div>`, `__label` → `<dt>`
- [x] **`account.php`**: Replace `<div class="admin-danger-zone__description">` with `<p>`
- [x] **`account.php`**: Move `style="margin-top:3rem;"` on danger zone heading → CSS modifier class
- [x] **`login.php`**: Wrap login content in `<main>` (currently no main landmark)
- [x] **`login.php`**: Extract inline styles on `.admin-form-row` and `.admin-form-footer` — `login.php` has no `style=` attributes; `.admin-login-box` modifier in `admin.css` already handles the compact layout
## Favicon
- [x] **`admin_favicon.svg` used as public-facing favicon** — created `public/assets/favicon.svg` (brand purple `#9557b5` lettermark “P”); `templates/head.php` now serves `favicon.svg` on public pages and `admin_favicon.svg` on admin pages
Reference in New Issue View Git Blame Copy Permalink