diff --git a/app/public/assets/css/admin.css b/app/public/assets/css/admin.css index cfa1f5f..36bad56 100644 --- a/app/public/assets/css/admin.css +++ b/app/public/assets/css/admin.css @@ -4,66 +4,66 @@ /* ── Layout ────────────────────────────────────────────────────────────── */ .admin-body { - display: flex; - flex-direction: column; - height: 100%; - overflow: hidden; + display: flex; + flex-direction: column; + height: 100%; + overflow: hidden; } /* Keep admin header single-row like public header */ .admin-body header nav { - overflow-x: auto; - white-space: nowrap; + overflow-x: auto; + white-space: nowrap; } .admin-body header nav .nav-right-links { - flex-shrink: 0; + flex-shrink: 0; } .admin-body header nav ul [data-nav-logout] a { - opacity: 0.6; - display: flex; - align-items: center; + opacity: 0.6; + display: flex; + align-items: center; } .admin-body header nav ul [data-nav-logout] a:hover { - opacity: 1; + opacity: 1; } .admin-body header nav ul [data-nav-logout] a svg { - display: block; - width: 20px; - height: 20px; + display: block; + width: 20px; + height: 20px; } /* Public-site link icon in admin nav */ .admin-body header nav .nav-logo { - display: grid; - grid-auto-flow: column; - align-items: center; - column-gap: 0.4em; + display: grid; + grid-auto-flow: column; + align-items: center; + column-gap: 0.4em; } .admin-body header nav .nav-logo svg { - width: 16px; - height: 16px; + width: 16px; + height: 16px; } .admin-body main { - flex: 1; - min-height: 0; - overflow-y: auto; - width: 100%; - background: linear-gradient( - 180deg, - rgba(149, 87, 181, 0.18) 0%, - rgba(0, 0, 0, 0) 6% - ); + flex: 1; + min-height: 0; + overflow-y: auto; + width: 100%; + background: linear-gradient( + 180deg, + rgba(149, 87, 181, 0.18) 0%, + rgba(0, 0, 0, 0) 6% + ); } .admin-body main:not(:has(.admin-table--sticky)) { - padding: 2ch; + padding: 2ch; } .admin-main--list { - padding: 0; + padding: 0; } .admin-main--list > form, @@ -71,263 +71,263 @@ .admin-main--list > .flash-success, .admin-main--list > .flash-error, .admin-main--list > .admin-empty { - margin-left: var(--space-m); - margin-right: var(--space-m); + margin-left: var(--space-m); + margin-right: var(--space-m); } #admin-table-wrap { - padding: 0 0 var(--space-2xl); + padding: 0 0 var(--space-2xl); } .admin-body main > table tbody tr:nth-child(even) { - background: var(--bg-secondary); + background: var(--bg-secondary); } .admin-table-row:hover { - background: var(--blue-muted-bg); + background: var(--blue-muted-bg); } .admin-body main > h1, .admin-list-header > h1 { - text-transform: uppercase; - letter-spacing: 0.08em; - margin: 0 0 var(--space-l) 0; - display: flex; - align-items: center; - gap: var(--space-2xs); + text-transform: uppercase; + letter-spacing: 0.08em; + margin: 0 0 var(--space-l) 0; + display: flex; + align-items: center; + gap: var(--space-2xs); } .admin-back-btn { - display: inline-flex; - align-items: center; - justify-content: center; - width: 40px; - height: 40px; - border-radius: var(--radius); - color: var(--text-secondary); - text-decoration: none; - transition: - background 0.15s, - color 0.15s; - flex-shrink: 0; - vertical-align: middle; - margin-right: var(--space-2xs); + display: inline-flex; + align-items: center; + justify-content: center; + width: 40px; + height: 40px; + border-radius: var(--radius); + color: var(--text-secondary); + text-decoration: none; + transition: + background 0.15s, + color 0.15s; + flex-shrink: 0; + vertical-align: middle; + margin-right: var(--space-2xs); } .admin-back-btn:hover { - background: var(--bg-secondary); - color: var(--accent-primary); + background: var(--bg-secondary); + color: var(--accent-primary); } .admin-back-btn svg { - width: 28px; - height: 28px; - fill: currentColor; + width: 28px; + height: 28px; + fill: currentColor; } /* ── Form styles → see form-base.css + form-admin.css ───────────────────── */ /* ── Buttons ────────────────────────────────────────────────────────────── */ .admin-form-footer { - margin-top: var(--space-l); + margin-top: var(--space-l); } /* ── Admin button aliases — see components/buttons.css .btn base class ─── */ .admin-btn { - /* deprecated alias for .btn--primary; kept for backward-compat */ + /* deprecated alias for .btn--primary; kept for backward-compat */ } .admin-btn-secondary { - /* deprecated alias for .btn--secondary; kept for backward-compat */ + /* deprecated alias for .btn--secondary; kept for backward-compat */ } .admin-btn--sm { - /* deprecated alias for .btn--sm; kept for backward-compat */ + /* deprecated alias for .btn--sm; kept for backward-compat */ } .admin-btn--warning { - /* deprecated alias for .btn--warning; kept for backward-compat */ + /* deprecated alias for .btn--warning; kept for backward-compat */ } .admin-btn--danger { - /* deprecated alias for .btn--danger; kept for backward-compat */ + /* deprecated alias for .btn--danger; kept for backward-compat */ } /* ── Toast messages — styles in components/toast.css ───────────────── */ /* ── Stats cards ────────────────────────────────────────────────────────── */ .admin-stats { - display: flex; - gap: var(--space-2xs); - flex-wrap: wrap; - margin: 0; + display: flex; + gap: var(--space-2xs); + flex-wrap: wrap; + margin: 0; } .admin-stat { - background: var(--bg-secondary); - border: 1px solid var(--border-primary); - border-radius: var(--radius); - padding: var(--space-2xs) var(--space-xs); - min-width: 0; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - margin: 0; - gap: var(--space-3xs); + background: var(--bg-secondary); + border: 1px solid var(--border-primary); + border-radius: var(--radius); + padding: var(--space-2xs) var(--space-xs); + min-width: 0; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + margin: 0; + gap: var(--space-3xs); } .admin-stat--pub .admin-stat__number { - color: var(--accent-green); + color: var(--accent-green); } .admin-stat--pub .admin-stat__number:empty::after, .admin-stat--pub .admin-stat__number[data-empty] { - color: var(--text-tertiary); + color: var(--text-tertiary); } .admin-stat--pend .admin-stat__number { - color: var(--accent-yellow); + color: var(--accent-yellow); } .admin-stat--pend .admin-stat__number:empty::after, .admin-stat--pend .admin-stat__number[data-empty] { - color: var(--text-tertiary); + color: var(--text-tertiary); } .admin-stat legend { - font-size: var(--step--2); - font-weight: 400; - text-transform: none; - letter-spacing: normal; - color: var(--text-secondary); - padding: 0; - float: none; - margin: 0; - width: auto; + font-size: var(--step--2); + font-weight: 400; + text-transform: none; + letter-spacing: normal; + color: var(--text-secondary); + padding: 0; + float: none; + margin: 0; + width: auto; } .admin-stat__number { - font-size: var(--step-1); - font-weight: 700; - color: var(--accent-primary); - line-height: 1; + font-size: var(--step-1); + font-weight: 700; + color: var(--accent-primary); + line-height: 1; } /* ── Stats (inline badge-like counters) ────────────────────────────── */ /* ── Maintenance bar ────────────────────────────────────────────────────── */ .admin-maintenance-bar { - display: flex; - align-items: center; - justify-content: space-between; - gap: var(--space-s); - background: var(--bg-secondary); - border: 1px solid var(--border-primary); - border-radius: var(--radius); - padding: var(--space-2xs) var(--space-s); - margin-bottom: var(--space-m); - font-size: var(--step--1); + display: flex; + align-items: center; + justify-content: space-between; + gap: var(--space-s); + background: var(--bg-secondary); + border: 1px solid var(--border-primary); + border-radius: var(--radius); + padding: var(--space-2xs) var(--space-s); + margin-bottom: var(--space-m); + font-size: var(--step--1); } .admin-maintenance-bar--active { - background: var(--warning-muted-bg); - border-color: var(--warning); - color: var(--text-primary); + background: var(--warning-muted-bg); + border-color: var(--warning); + color: var(--text-primary); } .admin-maintenance-bar form { - display: inline; + display: inline; } /* Result-count line above the thesis table */ .admin-list-meta { - color: var(--text-secondary); - font-size: var(--step--1); - margin-bottom: var(--space-2xs); + color: var(--text-secondary); + font-size: var(--step--1); + margin-bottom: var(--space-2xs); } /* Empty-state message below the thesis table */ .admin-empty { - color: var(--text-secondary); - padding: var(--space-s) var(--space-2xs); - text-align: center; + color: var(--text-secondary); + padding: var(--space-s) var(--space-2xs); + text-align: center; } /* "Load more" sentinel row for infinite-scroll admin tables (contenus). Sits at the bottom of the
; htmx replaces it with the next page of rows when it scrolls into the table's viewport. */ .admin-load-more__cell { - color: var(--text-tertiary); - padding: var(--space-s) var(--space-2xs); - text-align: center; - font-size: var(--step--1); + color: var(--text-tertiary); + padding: var(--space-s) var(--space-2xs); + text-align: center; + font-size: var(--step--1); } /* Fade the sentinel out once its request is in flight so it does not visually "stick" while the next page is fetched. */ .admin-load-more.htmx-request .admin-load-more__cell { - opacity: 0.4; + opacity: 0.4; } /* Identifier column in the thesis table */ .admin-table-id { - color: var(--text-secondary); - font-size: var(--step--2); - white-space: nowrap; + color: var(--text-secondary); + font-size: var(--step--2); + white-space: nowrap; } /* ── Filters bar ────────────────────────────────────────────────────────── */ .admin-filters { - display: flex; - gap: var(--space-xs); - margin-bottom: var(--space-m); - flex-wrap: wrap; - align-items: center; + display: flex; + gap: var(--space-xs); + margin-bottom: var(--space-m); + flex-wrap: wrap; + align-items: center; } .admin-filters-btn { - /* deprecated alias for .btn--primary; kept for backward-compat */ + /* deprecated alias for .btn--primary; kept for backward-compat */ } .admin-filters-reset { - /* deprecated alias for .btn--secondary; kept for backward-compat */ + /* deprecated alias for .btn--secondary; kept for backward-compat */ } /* ── Bulk actions bar ───────────────────────────────────────────────────── */ .admin-bulk-actions { - display: none; - align-items: center; - gap: var(--space-s); - padding: var(--space-2xs) var(--space-s); - background: var(--bg-secondary); - border: 1px solid var(--border-primary); - border-radius: var(--radius); - margin-bottom: var(--space-s); - font-size: var(--step--1); - position: sticky; - top: 0; - z-index: 10; + display: none; + align-items: center; + gap: var(--space-s); + padding: var(--space-2xs) var(--space-s); + background: var(--bg-secondary); + border: 1px solid var(--border-primary); + border-radius: var(--radius); + margin-bottom: var(--space-s); + font-size: var(--step--1); + position: sticky; + top: 0; + z-index: 10; } .admin-bulk-btns { - display: flex; - gap: var(--space-2xs); + display: flex; + gap: var(--space-2xs); } .admin-stat--inline { - font-size: var(--step--1); - color: var(--text-secondary); - font-weight: 500; - white-space: nowrap; + font-size: var(--step--1); + color: var(--text-secondary); + font-weight: 500; + white-space: nowrap; } /* ── Table ──────────────────────────────────────────────────────────────── */ /* Base table/th/td styles live in components/tables.css */ .admin-body main > table, #admin-table-wrap > table { - margin-top: var(--space-3xs); + margin-top: var(--space-3xs); } /* Tight horizontal padding: the table lives inside #admin-table-wrap, so the @@ -335,50 +335,50 @@ --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); + padding: var(--space-3xs) var(--space-2xs); } td.admin-ap-col, th.admin-ap-col { - white-space: nowrap; + white-space: nowrap; } .admin-na { - color: var(--text-tertiary); - font-style: italic; + color: var(--text-tertiary); + font-style: italic; } /* Sortable column headers */ .admin-sort-link { - color: inherit; - text-decoration: none; - display: inline-flex; - align-items: center; - gap: 2px; - transition: color 0.15s; + color: inherit; + text-decoration: none; + display: inline-flex; + align-items: center; + gap: 2px; + transition: color 0.15s; } .admin-sort-link:hover { - color: var(--accent-primary); + color: var(--accent-primary); } .admin-body table tr:hover td { - background: var(--bg-secondary); + background: var(--bg-secondary); } .admin-body table .thesis-title { - font-weight: 500; - display: -webkit-box; - -webkit-line-clamp: 2; - -webkit-box-orient: vertical; - overflow: hidden; - word-break: break-word; + font-weight: 500; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; + word-break: break-word; } .admin-body table .thesis-subtitle { - font-size: var(--step--1); - color: var(--text-secondary); - font-style: italic; + font-size: var(--step--1); + color: var(--text-secondary); + font-style: italic; } /* ── Status badges ──────────────────────────────────────────────────────── */ @@ -386,395 +386,395 @@ th.admin-ap-col { /* ── Compact table badges (admin-only override) ──────────────────── */ .admin-body .status-badge { - font-size: 0.7rem; - padding: 2px var(--space-3xs); + font-size: 0.7rem; + padding: 2px var(--space-3xs); } /* ── Compact icon buttons for table rows ──────────────────────────── */ .admin-icon-btn { - display: inline-flex; - align-items: center; - justify-content: center; - width: 28px; - height: 28px; - padding: 3px; - border-radius: var(--radius); - border: 1px solid transparent; - background: transparent; - color: var(--text-secondary); - cursor: pointer; - text-decoration: none; - transition: - background 0.15s, - color 0.15s, - border-color 0.15s; - line-height: 1; + display: inline-flex; + align-items: center; + justify-content: center; + width: 28px; + height: 28px; + padding: 3px; + border-radius: var(--radius); + border: 1px solid transparent; + background: transparent; + color: var(--text-secondary); + cursor: pointer; + text-decoration: none; + transition: + background 0.15s, + color 0.15s, + border-color 0.15s; + line-height: 1; } .admin-icon-btn svg { - width: 16px; - height: 16px; - fill: currentColor; - flex-shrink: 0; + width: 16px; + height: 16px; + fill: currentColor; + flex-shrink: 0; } .admin-icon-btn:hover { - background: var(--bg-secondary); - color: var(--text-primary); - border-color: var(--border-primary); + background: var(--bg-secondary); + color: var(--text-primary); + border-color: var(--border-primary); } .admin-icon-btn--view:hover { - background: var(--blue-muted-bg); - color: var(--accent-blue); - border-color: var(--blue-muted-border); + background: var(--blue-muted-bg); + color: var(--accent-blue); + border-color: var(--blue-muted-border); } .admin-icon-btn--edit:hover { - background: var(--yellow-muted-bg); - color: var(--accent-yellow); - border-color: var(--yellow-muted-border); + background: var(--yellow-muted-bg); + color: var(--accent-yellow); + border-color: var(--yellow-muted-border); } .admin-icon-btn--publish:hover { - background: var(--green-muted-bg); - color: var(--accent-green); - border-color: var(--green-muted-border); + background: var(--green-muted-bg); + color: var(--accent-green); + border-color: var(--green-muted-border); } .admin-icon-btn--unpublish:hover { - background: var(--bg-secondary); - color: var(--text-secondary); - border-color: var(--border-primary); + background: var(--bg-secondary); + color: var(--text-secondary); + border-color: var(--border-primary); } .admin-icon-btn--delete:hover { - background: var(--error-muted-bg); - color: var(--error); - border-color: var(--danger-border-muted); + background: var(--error-muted-bg); + color: var(--error); + border-color: var(--danger-border-muted); } .admin-icon-btn--copy:hover { - background: var(--blue-muted-bg); - color: var(--accent-blue); - border-color: var(--blue-muted-border); + background: var(--blue-muted-bg); + color: var(--accent-blue); + border-color: var(--blue-muted-border); } .admin-icon-btn--key:hover { - background: var(--yellow-muted-bg); - color: var(--accent-yellow); - border-color: var(--yellow-muted-border); + background: var(--yellow-muted-bg); + color: var(--accent-yellow); + border-color: var(--yellow-muted-border); } .admin-icon-btn--archive:hover { - background: var(--bg-secondary); - color: var(--text-secondary); - border-color: var(--border-primary); + background: var(--bg-secondary); + color: var(--text-secondary); + border-color: var(--border-primary); } .admin-icon-btn--merge:hover { - background: var(--yellow-muted-bg); - color: var(--accent-yellow); - border-color: var(--yellow-muted-border); + background: var(--yellow-muted-bg); + color: var(--accent-yellow); + border-color: var(--yellow-muted-border); } /* ── Action buttons in table — see components/buttons.css .btn base class ─ */ .admin-actions { - display: flex; - gap: var(--space-3xs); - flex-wrap: nowrap; - white-space: nowrap; + display: flex; + gap: var(--space-3xs); + flex-wrap: nowrap; + white-space: nowrap; } .admin-actions-col { - white-space: nowrap; + white-space: nowrap; } /* Legacy table-action size — now just an alias */ .admin-btn-sm { - /* deprecated alias for .btn--sm; kept for backward-compat */ + /* deprecated alias for .btn--sm; kept for backward-compat */ } .admin-btn-view { - /* deprecated alias for .btn--sm .btn--blue */ + /* deprecated alias for .btn--sm .btn--blue */ } .admin-btn-visit { - /* deprecated alias for .btn--sm .btn--green */ + /* deprecated alias for .btn--sm .btn--green */ } .admin-btn-edit { - /* deprecated alias for .btn--sm .btn--yellow */ + /* deprecated alias for .btn--sm .btn--yellow */ } .admin-btn-publish { - /* deprecated alias for .btn--sm .btn--green */ + /* deprecated alias for .btn--sm .btn--green */ } .admin-btn-unpublish { - /* deprecated alias for .btn--sm .btn--muted */ + /* deprecated alias for .btn--sm .btn--muted */ } .admin-btn-delete { - /* deprecated alias for .btn--sm .btn--red */ + /* deprecated alias for .btn--sm .btn--red */ } .publish-form { - display: inline; - margin: 0; + display: inline; + margin: 0; } /* ── Thesis info sections (thanks page) ─────────────────────────────────── */ .admin-body main > section:not([aria-labelledby^="settings-"]) { - border: 1px solid var(--border-primary); - border-radius: var(--radius); - padding: var(--space-m); - margin-bottom: var(--space-m); + border: 1px solid var(--border-primary); + border-radius: var(--radius); + padding: var(--space-m); + margin-bottom: var(--space-m); } .admin-body main > section:not([aria-labelledby^="settings-"]) h2 { - margin: 0 0 var(--space-s); - border-bottom: 1px solid var(--border-primary); - padding-bottom: var(--space-2xs); + margin: 0 0 var(--space-s); + border-bottom: 1px solid var(--border-primary); + padding-bottom: var(--space-2xs); } .admin-body main > section:not([aria-labelledby^="settings-"]) dl { - display: grid; - grid-template-columns: 180px 1fr; - gap: var(--space-3xs) var(--space-s); + display: grid; + grid-template-columns: 180px 1fr; + gap: var(--space-3xs) var(--space-s); } .admin-body main > section:not([aria-labelledby^="settings-"]) dt { - font-weight: 600; - font-size: var(--step--1); - color: var(--text-secondary); + font-weight: 600; + font-size: var(--step--1); + color: var(--text-secondary); } .admin-body main > section:not([aria-labelledby^="settings-"]) dd { - margin: 0; - font-size: var(--step--1); + margin: 0; + font-size: var(--step--1); } /* ── Flat sections (no border card) — parametres + contenus ─────────────── */ .admin-body main > section[aria-labelledby^="settings-"], .admin-body main > section[aria-labelledby^="static-pages-"], .admin-body main > section[aria-labelledby^="form-settings-"] { - border: none; - border-radius: 0; - padding: 0; - margin-bottom: var(--space-xl); + border: none; + border-radius: 0; + padding: 0; + margin-bottom: var(--space-xl); } /* Fieldsets inside flat settings sections: no card border */ .admin-body main > section[aria-labelledby^="settings-"] fieldset { - border: none; - border-radius: 0; - padding: var(--space-m) 0; + border: none; + border-radius: 0; + padding: var(--space-m) 0; } .admin-body main > section[aria-labelledby^="settings-"] fieldset legend { - padding: 0; - font-weight: 400; - letter-spacing: 0.04em; - text-transform: uppercase; - color: var(--text-secondary); + padding: 0; + font-weight: 400; + letter-spacing: 0.04em; + text-transform: uppercase; + color: var(--text-secondary); } .admin-body main > section[aria-labelledby^="settings-"] > h2, .admin-body main > section[aria-labelledby^="static-pages-"] > h2 { - font-weight: 600; - letter-spacing: 0.06em; - text-transform: uppercase; - color: var(--text-secondary); - margin: 0 0 var(--space-m); - padding-bottom: var(--space-2xs); - border-bottom: 1px solid var(--border-primary); + font-weight: 600; + letter-spacing: 0.06em; + text-transform: uppercase; + color: var(--text-secondary); + margin: 0 0 var(--space-m); + padding-bottom: var(--space-2xs); + border-bottom: 1px solid var(--border-primary); } .admin-action-bar { - margin-top: var(--space-m); - display: flex; - gap: var(--space-xs); - flex-wrap: wrap; + margin-top: var(--space-m); + display: flex; + gap: var(--space-xs); + flex-wrap: wrap; } .admin-muted { - color: var(--text-secondary); + color: var(--text-secondary); } /* ── Section titles (account, etc.) ─────────────────────────────────────── */ .admin-section-title { - font-size: var(--step-0); - font-weight: 600; - letter-spacing: 0.07em; - text-transform: uppercase; - color: var(--text-secondary); - margin: var(--space-l) 0 var(--space-s); - padding-bottom: var(--space-2xs); - border-bottom: 1px solid var(--border-primary); + font-size: var(--step-0); + font-weight: 600; + letter-spacing: 0.07em; + text-transform: uppercase; + color: var(--text-secondary); + margin: var(--space-l) 0 var(--space-s); + padding-bottom: var(--space-2xs); + border-bottom: 1px solid var(--border-primary); } .admin-section-title--danger { - color: var(--error); - border-color: var(--error); + color: var(--error); + border-color: var(--error); } /* ── Account status block ───────────────────────────────────────────────── */ .admin-account-status { - border: 1px solid var(--border-primary); - border-radius: var(--radius); - padding: var(--space-s) var(--space-m); - margin-bottom: var(--space-l); - display: flex; - flex-direction: column; - gap: var(--space-xs); + border: 1px solid var(--border-primary); + border-radius: var(--radius); + padding: var(--space-s) var(--space-m); + margin-bottom: var(--space-l); + display: flex; + flex-direction: column; + gap: var(--space-xs); } .admin-account-status__row { - display: flex; - align-items: center; - gap: var(--space-xs); - font-size: var(--step--1); + display: flex; + align-items: center; + gap: var(--space-xs); + font-size: var(--step--1); } .admin-account-status__label { - color: var(--text-secondary); - min-width: 220px; + color: var(--text-secondary); + min-width: 220px; } .admin-account-status__code { - font-family: ui-monospace, "SFMono-Regular", Consolas, monospace; - font-size: var(--step--2); - border: 1px solid var(--border-primary); - border-radius: var(--radius); - padding: var(--space-3xs) var(--space-3xs); - color: var(--text-secondary); - background: var(--bg-secondary); + font-family: ui-monospace, "SFMono-Regular", Consolas, monospace; + font-size: var(--step--2); + border: 1px solid var(--border-primary); + border-radius: var(--radius); + padding: var(--space-3xs) var(--space-3xs); + color: var(--text-secondary); + background: var(--bg-secondary); } .admin-account-status__note { - font-size: var(--step--1); - color: var(--text-secondary); - margin: 0; + font-size: var(--step--1); + color: var(--text-secondary); + margin: 0; } /* ── Danger zone (account page) ─────────────────────────────────────────── */ .admin-danger-zone { - border: 1px solid var(--danger-border-muted); - border-radius: var(--radius); - padding: var(--space-m) var(--space-m); - display: flex; - align-items: center; - gap: var(--space-m); - flex-wrap: wrap; + border: 1px solid var(--danger-border-muted); + border-radius: var(--radius); + padding: var(--space-m) var(--space-m); + display: flex; + align-items: center; + gap: var(--space-m); + flex-wrap: wrap; } .admin-danger-zone__description { - flex: 1; - font-size: var(--step--1); + flex: 1; + font-size: var(--step--1); } /* ── Login page ─────────────────────────────────────────────────────────── */ .admin-login-wrap { - display: flex; - align-items: center; - justify-content: center; - min-height: calc(100vh - 60px); + display: flex; + align-items: center; + justify-content: center; + min-height: calc(100vh - 60px); } .admin-login-box { - background: var(--bg-secondary); - border: 1px solid var(--border-primary); - border-radius: var(--radius); - padding: var(--space-l); - width: 100%; - max-width: 420px; + background: var(--bg-secondary); + border: 1px solid var(--border-primary); + border-radius: var(--radius); + padding: var(--space-l); + width: 100%; + max-width: 420px; } .admin-login-box h2 { - margin: 0 0 var(--space-m); - font-weight: 500; - text-align: center; - hyphens: none; - overflow-wrap: normal; - word-break: normal; + margin: 0 0 var(--space-m); + font-weight: 500; + text-align: center; + hyphens: none; + overflow-wrap: normal; + word-break: normal; } .admin-login-box .admin-form > div:not(.admin-form-footer) { - grid-template-columns: 1fr; - border: none; - padding: var(--space-3xs) 0; + grid-template-columns: 1fr; + border: none; + padding: var(--space-3xs) 0; } .admin-login-box .admin-form > div:not(.admin-form-footer) > label { - font-size: var(--step--1); - color: var(--text-secondary); - margin-bottom: var(--space-3xs); + font-size: var(--step--1); + color: var(--text-secondary); + margin-bottom: var(--space-3xs); } .admin-login-box .admin-form-footer { - margin-top: var(--space-s); - padding-top: var(--space-2xs); + margin-top: var(--space-s); + padding-top: var(--space-2xs); } .admin-login-box .btn { - width: 100%; + width: 100%; } /* ════ Import status card (dialog) ═══════════════════════════════════════ */ .admin-import-status-card { - margin: 0; - padding: var(--space-m) var(--space-l); + margin: 0; + padding: var(--space-m) var(--space-l); } .admin-import-status-card__success { - background: var(--success-muted-bg); - border: 1px solid var(--success); - border-left: 3px solid var(--success); - border-radius: var(--radius); - padding: var(--space-xs) var(--space-s); - font-size: var(--step--1); - margin: 0; + background: var(--success-muted-bg); + border: 1px solid var(--success); + border-left: 3px solid var(--success); + border-radius: var(--radius); + padding: var(--space-xs) var(--space-s); + font-size: var(--step--1); + margin: 0; } .admin-import-status-card__errors { - background: var(--accent-muted); - border: 1px solid var(--error); - border-left: 3px solid var(--error); - border-radius: var(--radius); - padding: var(--space-xs) var(--space-s); - font-size: var(--step--1); - margin-bottom: var(--space-s); + background: var(--accent-muted); + border: 1px solid var(--error); + border-left: 3px solid var(--error); + border-radius: var(--radius); + padding: var(--space-xs) var(--space-s); + font-size: var(--step--1); + margin-bottom: var(--space-s); } .admin-import-status-card__errors .admin-error-list { - margin: var(--space-2xs) 0 0; - padding-left: var(--space-s); + margin: var(--space-2xs) 0 0; + padding-left: var(--space-s); } /* Import log details/summary */ .admin-import-log-details { - margin: 0; - padding: 0 var(--space-l) var(--space-m); + margin: 0; + padding: 0 var(--space-l) var(--space-m); } .admin-import-log-details summary { - cursor: pointer; - font-size: var(--step--1); - font-weight: 600; - color: var(--text-secondary); - padding: var(--space-2xs) 0; - border-top: 1px solid var(--border-primary); + cursor: pointer; + font-size: var(--step--1); + font-weight: 600; + color: var(--text-secondary); + padding: var(--space-2xs) 0; + border-top: 1px solid var(--border-primary); } .admin-import-log-details summary:hover { - color: var(--text-primary); + color: var(--text-primary); } /* Hint text under the file input */ .admin-file-hint { - display: block; - margin-top: var(--space-2xs); + display: block; + margin-top: var(--space-2xs); } /* Import dialog: Fichier CSV heading + empty-CSV-template button on one line (button on the right) */ @@ -788,614 +788,614 @@ th.admin-ap-col { /* Error list inside role="alert" */ .admin-error-list { - margin: var(--space-2xs) 0 0; - padding-left: var(--space-s); + margin: var(--space-2xs) 0 0; + padding-left: var(--space-s); } /* Import results panel (legacy, kept for backward compat) */ .admin-import-results { - margin-top: var(--space-l); + margin-top: var(--space-l); } .admin-import-results__title { - font-size: var(--step-0); - font-weight: 600; - margin-bottom: var(--space-xs); - color: var(--text-secondary); - text-transform: uppercase; - letter-spacing: 0.06em; - border: none; - padding: 0; + font-size: var(--step-0); + font-weight: 600; + margin-bottom: var(--space-xs); + color: var(--text-secondary); + text-transform: uppercase; + letter-spacing: 0.06em; + border: none; + padding: 0; } /* ── Jury fieldset → see form-base.css ──────────────────────────────────── */ /* ── Inline form (tags page) ────────────────────────────────────────────── */ .admin-inline-form { - display: flex; - align-items: center; - gap: var(--space-3xs); - flex-wrap: wrap; + display: flex; + align-items: center; + gap: var(--space-3xs); + flex-wrap: wrap; } .admin-input--inline, .admin-inline-form input[type="text"] { - width: 160px; + width: 160px; } .admin-select--inline, .admin-inline-form select { - width: 160px; + width: 160px; } /* Stack secondary forms (merge, delete) below the rename form */ .admin-inline-form + .admin-inline-form { - margin-top: var(--space-3xs); + margin-top: var(--space-3xs); } /* Tags table column sizing */ .admin-body table:has(.admin-tags-count) th:nth-child(1) { - width: 40%; + width: 40%; } .admin-body table:has(.admin-tags-count) th:nth-child(2) { - width: 12%; + width: 12%; } .admin-body table:has(.admin-tags-count) th:nth-child(3) { - width: 48%; + width: 48%; } .admin-tags-count { - text-align: center; + text-align: center; } /* ── Banner preview ─────────────────────────────────────────────────────── */ .admin-banner-preview img { - max-width: 320px; - max-height: 100px; - object-fit: cover; - border: 1px solid var(--border-primary); - border-radius: var(--radius); - display: block; - margin-top: var(--space-2xs); + max-width: 320px; + max-height: 100px; + object-fit: cover; + border: 1px solid var(--border-primary); + border-radius: var(--radius); + display: block; + margin-top: var(--space-2xs); } /* ── List page toolbar (generic grid header + right slot) ──────────────── */ .admin-list-toolbar { - display: grid; - grid-template-columns: 1fr auto; - gap: var(--space-m) var(--space-l); - margin-bottom: var(--space-m); - align-items: center; - padding: var(--space-m) 0 0; + display: grid; + grid-template-columns: 1fr auto; + gap: var(--space-m) var(--space-l); + margin-bottom: var(--space-m); + align-items: center; + padding: var(--space-m) 0 0; } .admin-list-toolbar h1 { - margin: 0; - white-space: nowrap; + margin: 0; + white-space: nowrap; } .admin-list-toolbar .admin-stats { - justify-self: end; + justify-self: end; } .admin-list-toolbar .admin-filters { - display: flex; - flex-direction: column; - gap: var(--space-xs); - margin-bottom: 0; - min-width: 0; + display: flex; + flex-direction: column; + gap: var(--space-xs); + margin-bottom: 0; + min-width: 0; } .admin-list-toolbar .admin-filters__search { - display: flex; - gap: var(--space-xs); - align-items: center; + display: flex; + gap: var(--space-xs); + align-items: center; } .admin-list-toolbar .admin-filters__search input[type="text"] { - min-width: 10rem; - flex: 1 1 10rem; + min-width: 10rem; + flex: 1 1 10rem; } .admin-list-toolbar .admin-filters__dropdowns { - display: flex; - gap: var(--space-xs); - flex-wrap: wrap; + display: flex; + gap: var(--space-xs); + flex-wrap: wrap; } .admin-list-toolbar .admin-filters__dropdowns select { - min-width: 7rem; - flex: 1 1 7rem; + min-width: 7rem; + flex: 1 1 7rem; } .admin-list-toolbar .admin-filters .btn { - flex-shrink: 0; + flex-shrink: 0; } .admin-list-toolbar__right { - display: flex; - flex-direction: column; - gap: var(--space-xs); + display: flex; + flex-direction: column; + gap: var(--space-xs); } /* ── List page toolbar (theses index — single-line search) ─────────────── */ .admin-list-toolbar--list { - gap: var(--space-s); - padding: 2ch 2ch 0; - display: grid; - grid-template-columns: 1fr; - grid-template-rows: 1fr 1fr; - grid-template-areas: - "header" - "filters"; + gap: var(--space-s); + padding: 2ch 2ch 0; + display: grid; + grid-template-columns: 1fr; + grid-template-rows: 1fr 1fr; + grid-template-areas: + "header" + "filters"; } .admin-list-toolbar--list .admin-toolbar-top { - grid-area: header; - display: grid; - grid-template-columns: 1fr 1fr; - grid-template-rows: 1fr; - gap: 0px 0px; - grid-template-areas: "header edit"; + grid-area: header; + display: grid; + grid-template-columns: 1fr 1fr; + grid-template-rows: 1fr; + gap: 0px 0px; + grid-template-areas: "header edit"; } .admin-toolbar-top h1 { - grid-area: header; - margin: 0; - white-space: nowrap; + grid-area: header; + margin: 0; + white-space: nowrap; } .admin-btn-group { - grid-area: edit; - display: flex; - gap: var(--space-2xs); - flex-wrap: wrap; + grid-area: edit; + display: flex; + gap: var(--space-2xs); + flex-wrap: wrap; } .admin-list-toolbar--list .admin-filters { - grid-area: filters; - display: flex; - flex-direction: row; - gap: var(--space-xs); - margin-bottom: 0; + grid-area: filters; + display: flex; + flex-direction: row; + gap: var(--space-xs); + margin-bottom: 0; } .admin-list-toolbar--list .admin-filters input[type="text"] { - flex: 1 1 auto; - min-width: 8rem; + flex: 1 1 auto; + min-width: 8rem; } .admin-list-toolbar--list .admin-filters select { - min-width: 6rem; - flex-shrink: 0; + min-width: 6rem; + flex-shrink: 0; } .admin-list-toolbar--list .admin-filters .btn { - flex-shrink: 0; + flex-shrink: 0; } .admin-btn-group { - display: flex; - gap: var(--space-xs); - flex-wrap: wrap; + display: flex; + gap: var(--space-xs); + flex-wrap: wrap; } /* ── Dialog ───────────────────────────────────────────────────────────── */ /* Base dialog/::backdrop styles live in components/dialog.css */ .admin-dialog { - max-width: 680px; - width: 100%; + max-width: 680px; + width: 100%; } .admin-dialog__header { - display: flex; - align-items: center; - justify-content: space-between; - padding: var(--space-m) var(--space-l); - border-bottom: 1px solid var(--border-primary); + display: flex; + align-items: center; + justify-content: space-between; + padding: var(--space-m) var(--space-l); + border-bottom: 1px solid var(--border-primary); } .admin-dialog__header h3 { - font-weight: 600; - letter-spacing: 0.06em; - text-transform: uppercase; - margin: 0; - color: var(--text-secondary); + font-weight: 600; + letter-spacing: 0.06em; + text-transform: uppercase; + margin: 0; + color: var(--text-secondary); } .admin-dialog__close { - background: none; - border: none; - cursor: pointer; - font-size: var(--step-0); - color: var(--text-tertiary); - padding: var(--space-3xs); - line-height: 1; - border-radius: var(--radius); - transition: color 0.15s; + background: none; + border: none; + cursor: pointer; + font-size: var(--step-0); + color: var(--text-tertiary); + padding: var(--space-3xs); + line-height: 1; + border-radius: var(--radius); + transition: color 0.15s; } .admin-dialog__close:hover { - color: var(--text-primary); + color: var(--text-primary); } .admin-dialog .admin-form, .admin-dialog .admin-import-results, .admin-dialog .toast, .admin-dialog__alert { - margin: 0; - padding: var(--space-m) var(--space-l); + margin: 0; + padding: var(--space-m) var(--space-l); } .admin-dialog .admin-form { - padding-top: var(--space-m); - padding-bottom: 0; + padding-top: var(--space-m); + padding-bottom: 0; } .admin-dialog .admin-form-footer { - display: flex; - gap: var(--space-xs); - padding: 0 var(--space-l) var(--space-m); + display: flex; + gap: var(--space-xs); + padding: 0 var(--space-l) var(--space-m); } /* Small/confirmation dialog variant */ .admin-dialog--sm { - max-width: 420px; + max-width: 420px; } .admin-dialog__alert { - padding: var(--space-m) var(--space-l); - font-size: var(--step--1); - line-height: 1.6; + padding: var(--space-m) var(--space-l); + font-size: var(--step--1); + line-height: 1.6; } .admin-dialog__alert p:not(:last-child) { - margin: 0 0 var(--space-xs) 0; + margin: 0 0 var(--space-xs) 0; } .admin-dialog__alert p:last-child { - margin: 0; + margin: 0; } .admin-dialog__body { - padding: var(--space-m) var(--space-l); - font-size: var(--step--1); - line-height: 1.6; - overflow-y: auto; - flex: 1; - min-height: 0; + padding: var(--space-m) var(--space-l); + font-size: var(--step--1); + line-height: 1.6; + overflow-y: auto; + flex: 1; + min-height: 0; } .admin-dialog__body > *:first-child { - margin-top: 0; + margin-top: 0; } .admin-dialog__body > *:last-child { - margin-bottom: 0; + margin-bottom: 0; } .admin-dialog__stats { - margin: var(--space-sm) 0; - padding: var(--space-sm); - background: var(--bg-secondary); - border-radius: 8px; - font-size: var(--step--1); - line-height: 1.6; + margin: var(--space-sm) 0; + padding: var(--space-sm); + background: var(--bg-secondary); + border-radius: 8px; + font-size: var(--step--1); + line-height: 1.6; } .admin-dialog__hint { - font-size: var(--step--2); - color: var(--text-secondary); - margin: var(--space-xs) 0 0 0; + font-size: var(--step--2); + color: var(--text-secondary); + margin: var(--space-xs) 0 0 0; } .admin-dialog__footer { - display: flex; - gap: var(--space-xs); - padding: 0 var(--space-l) var(--space-m); + display: flex; + gap: var(--space-xs); + padding: 0 var(--space-l) var(--space-m); } /* Side-panel variant: pinned to right, full height */ .admin-dialog--sheet { - max-width: 720px; - max-height: 100vh; - height: 100vh; - margin: 0 0 0 auto; - border-radius: 16px 0 0 16px; - animation: adminSheetIn 0.3s ease-out; - overflow: hidden; + max-width: 720px; + max-height: 100vh; + height: 100vh; + margin: 0 0 0 auto; + border-radius: 16px 0 0 16px; + animation: adminSheetIn 0.3s ease-out; + overflow: hidden; } .admin-dialog--sheet[open] { - display: flex; - flex-direction: column; + display: flex; + flex-direction: column; } @keyframes adminSheetIn { - from { - transform: translateX(100%); - } - to { - transform: translateX(0); - } + from { + transform: translateX(100%); + } + to { + transform: translateX(0); + } } .admin-dialog--sheet::backdrop { - background: rgba(0, 0, 0, 0.5); + background: rgba(0, 0, 0, 0.5); } /* Dialog table: replaces grey background box with flat table + heading */ .n-table { - width: 100%; - border-collapse: collapse; - font-size: 0.85em; + width: 100%; + border-collapse: collapse; + font-size: 0.85em; } .n-table thead th { - text-align: left; - padding: var(--space-3xs) var(--space-xs); - border-bottom: 1px solid var(--border-primary); - font-weight: 600; - color: var(--text-secondary); - font-size: 0.9em; + text-align: left; + padding: var(--space-3xs) var(--space-xs); + border-bottom: 1px solid var(--border-primary); + font-weight: 600; + color: var(--text-secondary); + font-size: 0.9em; } .n-table tbody td { - padding: var(--space-3xs) var(--space-xs); - border-bottom: 1px solid var(--border-secondary); - vertical-align: top; + padding: var(--space-3xs) var(--space-xs); + border-bottom: 1px solid var(--border-secondary); + vertical-align: top; } .n-table .n-table__info { - color: var(--text-tertiary); - font-size: 0.9em; + color: var(--text-tertiary); + font-size: 0.9em; } .n-heading { - display: inline-flex; - align-items: center; - gap: var(--space-2xs); - margin: 0 0 var(--space-xs) 0; - font-size: var(--step--1); - font-weight: 600; - color: var(--text-primary); - line-height: 1.4; + display: inline-flex; + align-items: center; + gap: var(--space-2xs); + margin: 0 0 var(--space-xs) 0; + font-size: var(--step--1); + font-weight: 600; + color: var(--text-primary); + line-height: 1.4; } .n-meta { - font-weight: 400; - font-size: 0.9em; - color: var(--text-secondary); - margin-left: var(--space-2xs); + font-weight: 400; + font-size: 0.9em; + color: var(--text-secondary); + margin-left: var(--space-2xs); } /* Stat line rendered as a card under a cleanup-section heading. */ .cleanup-stat-card { - margin: 0 0 var(--space-m); - padding: var(--space-s) var(--space-l); - background: var(--bg-secondary); - border: 1px solid var(--border-primary); - border-radius: var(--radius); - font-size: var(--step-1); - font-weight: 700; - color: var(--accent-primary); - display: flex; - flex-wrap: wrap; - gap: var(--space-2xs) var(--space-m); - align-items: baseline; + margin: 0 0 var(--space-m); + padding: var(--space-s) var(--space-l); + background: var(--bg-secondary); + border: 1px solid var(--border-primary); + border-radius: var(--radius); + font-size: var(--step-1); + font-weight: 700; + color: var(--accent-primary); + display: flex; + flex-wrap: wrap; + gap: var(--space-2xs) var(--space-m); + align-items: baseline; } /* Short French explanation shown under a cleanup-section heading. */ .cleanup-section-desc { - margin: 0 0 var(--space-m); - font-size: var(--step--1); - line-height: 1.5; - color: var(--text-secondary); - max-width: 70ch; + margin: 0 0 var(--space-m); + font-size: var(--step--1); + line-height: 1.5; + color: var(--text-secondary); + max-width: 70ch; } .n-grid { - display: block; + display: block; } .n-section, .n-grid > section, .n-grid > details { - margin: 2ch 0; - border: none; - border-radius: 0; - background: transparent; - overflow: visible; + margin: 2ch 0; + border: none; + border-radius: 0; + background: transparent; + overflow: visible; } .n-section:first-child, .n-grid > section:first-child, .n-grid > details:first-child { - margin-top: 0; + margin-top: 0; } .n-section:last-child, .n-grid > section:last-child, .n-grid > details:last-child { - margin-bottom: 0; + margin-bottom: 0; } .n-grid .n-heading { - margin-top: 0; + margin-top: 0; } /*