fix(admin): prevent access badge text wrapping in index table

Add white-space: nowrap to .status-access so 'Interne'/'Interdit'
no longer break mid-word in the narrow Accès column.
This commit is contained in:
Pontoporeia
2026-09-18 16:26:49 +02:00
parent beff95c784
commit aa72aa5bc5
3 changed files with 18 additions and 7 deletions
+5
View File
@@ -3,6 +3,11 @@
> Last updated: 2026-08-31 > Last updated: 2026-08-31
> Context: CSS waste strategy — full stream DEFERRED (tasks 10/u/w/x/y/z): unusedSymbols report showed only ~6.2KB/2.9% of 216KB reclaimable; pruning + per-page split parked (docs/css-split-analysis.md). #t (Interdit admin route) confirmed already implemented via /admin/media.php + media-viewer.php + recapitulatif link. No pending live tasks. > Context: CSS waste strategy — full stream DEFERRED (tasks 10/u/w/x/y/z): unusedSymbols report showed only ~6.2KB/2.9% of 216KB reclaimable; pruning + per-page split parked (docs/css-split-analysis.md). #t (Interdit admin route) confirmed already implemented via /admin/media.php + media-viewer.php + recapitulatif link. No pending live tasks.
## Pending
- [x] #admin-index-toolbar-table-gap Reduce space between admin toolbar and index table. Gap was triple-stacked: `.admin-list-toolbar--list` bottom padding (2ch ≈ 16px) + `#admin-table-wrap > table` margin-top (--space-m ≈ 24px) + `.admin-search-indicator` margin-top (--space-2xs). Fix in app/public/assets/css/admin.css: toolbar padding → `2ch 2ch 0`, table margin-top → `--space-3xs` (~5px), indicator margin-top → 0. Total gap ~40px → ~5px.
- [x] #admin-index-column-spacing Narrow the admin index table columns. Root cause: table lives inside `#admin-table-wrap`, so the `.admin-body main > table th/td` override never matched (direct-child selector) and cells kept base `--space-xs` (~15px) sideways padding from components/tables.css → ~30px between columns. Fix: `.admin-body #admin-table-wrap th/td { padding: var(--space-3xs) var(--space-2xs) }` + fixed the sibling margin selector in app/public/assets/css/admin.css → gap now ~19px.
- [x] #admin-index-badges-nowrap Fix text wrapping in admin index table badges (Accès, Publié). `.status-badge` and `.status-access` had no `white-space: nowrap`, so "En attente"/"Interne" broke mid-word in narrow columns. Added `white-space: nowrap` to both in app/public/assets/css/components/badges.css (served directly, no build step).
## Pending ## Pending
- [x] #justfile-deploy-code-nginx-split [!medium] de-dup deploy-code: it bundled nginx config + server-side setup (full duplicate of deploy-nginx). Now code-only; deploy depends on deploy-nginx; provision-server's duplicate deploy-nginx removed; var/{cache,logs,tmp} mkdir moved into scripts/deploy-server.sh. - [x] #justfile-deploy-code-nginx-split [!medium] de-dup deploy-code: it bundled nginx config + server-side setup (full duplicate of deploy-nginx). Now code-only; deploy depends on deploy-nginx; provision-server's duplicate deploy-nginx removed; var/{cache,logs,tmp} mkdir moved into scripts/deploy-server.sh.
+11 -7
View File
@@ -309,13 +309,17 @@
/* ── Table ──────────────────────────────────────────────────────────────── */ /* ── Table ──────────────────────────────────────────────────────────────── */
/* Base table/th/td styles live in components/tables.css */ /* Base table/th/td styles live in components/tables.css */
.admin-body main > table { .admin-body main > table,
margin-top: var(--space-m); #admin-table-wrap > table {
margin-top: var(--space-3xs);
} }
.admin-body main > table th, /* Tight horizontal padding: the table lives inside #admin-table-wrap, so the
.admin-body main > table td { `main > table` selectors above never matched and cells kept the base
padding: var(--space-3xs); --space-xs (~15px) sideways padding from components/tables.css. */
.admin-body #admin-table-wrap th,
.admin-body #admin-table-wrap td {
padding: var(--space-3xs) var(--space-2xs);
} }
td.admin-ap-col, td.admin-ap-col,
@@ -901,7 +905,7 @@ th.admin-ap-col {
.admin-list-toolbar--list { .admin-list-toolbar--list {
gap: var(--space-s); gap: var(--space-s);
padding: 2ch; padding: 2ch 2ch 0;
display: grid; display: grid;
grid-template-columns: 1fr; grid-template-columns: 1fr;
grid-template-rows: 1fr 1fr; grid-template-rows: 1fr 1fr;
@@ -2234,7 +2238,7 @@ th.admin-ap-col {
opacity: 0; opacity: 0;
transition: opacity 0.15s; transition: opacity 0.15s;
pointer-events: none; pointer-events: none;
margin-top: var(--space-2xs); margin-top: 0;
} }
.admin-search-indicator.htmx-request { .admin-search-indicator.htmx-request {
@@ -5,6 +5,7 @@
.status-badge { .status-badge {
display: inline-block; display: inline-block;
white-space: nowrap;
padding: var(--space-3xs) var(--space-2xs); padding: var(--space-3xs) var(--space-2xs);
border-radius: var(--radius); border-radius: var(--radius);
font-size: var(--step--2); font-size: var(--step--2);
@@ -24,6 +25,7 @@
.status-access { .status-access {
display: inline-block; display: inline-block;
white-space: nowrap;
font-size: var(--step--2); font-size: var(--step--2);
padding: var(--space-3xs) var(--space-3xs); padding: var(--space-3xs) var(--space-3xs);
border-radius: var(--radius); border-radius: var(--radius);