PostERG/xamxam
1
0
Fork 0
mirror of https://codeberg.org/PostERG/xamxam.git synced 2026-05-06 11:09:18 +02:00
Code Issues Packages Projects Releases Wiki Activity

system.css: use only variables.css tokens, remove undefined custom properties

Browse Source 
Replace the two undefined variables that had crept in:
- var(--admin-border) → #555  (in .log-output border)
- var(--admin-text-muted) → #969696  (inline style on log toolbar label,
  in both system.php and system-fragment.php)

Revert the incorrect intermediate attempt that mapped dark-UI hex values
to light-theme tokens (--bg-primary: #fff, --border-primary: #ddd, etc.)
and also revert the .admin-body override block that was added to
variables.css — variables.css is shared and must not have per-component
overrides.

All remaining var() calls in system.css now reference tokens that exist
in variables.css:
  --accent-primary, --accent-green, --error, --warning, --success,
  --text-tertiary
The dark surface colours (#1a1a1a, #242424, #0d0d0d, #555, #969696, etc.)
stay as literal hex values, consistent with how admin.css handles them.
This commit is contained in:
Pontoporeia
2026-04-02 18:45:40 +02:00
parent b981223ff4
commit 871e919efa
3 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
public/admin/system-fragment.php
View File

@@ -173,7 +173,7 @@ if ($tab === 'nginx_config') {
} }
?> ?>
<div class="log-toolbar"> <div class="log-toolbar">
<label for="lines-select" style="font-size:.84rem;color:var(--admin-text-muted);">Afficher</label> <label for="lines-select" style="font-size:.84rem;color:var(--text-secondary);">Afficher</label>
<select id="lines-select" aria-label="Nombre de lignes"> <select id="lines-select" aria-label="Nombre de lignes">
<?php foreach (ALLOWED_LINES_FRAG as $opt): ?> <?php foreach (ALLOWED_LINES_FRAG as $opt): ?>
<option value="<?= $opt ?>" <?= $opt === $n ? 'selected' : '' ?>><?= $opt ?> dernières lignes</option> <option value="<?= $opt ?>" <?= $opt === $n ? 'selected' : '' ?>><?= $opt ?> dernières lignes</option>

2
public/admin/system.php
View File

@@ -669,7 +669,7 @@ require_once APP_ROOT . '/templates/head.php';
<!-- Lines selector (submits via JS on change; no button needed) --> <!-- Lines selector (submits via JS on change; no button needed) -->
<div class="log-toolbar"> <div class="log-toolbar">
<label for="lines-select" style="font-size:.84rem;color:var(--admin-text-muted);"> <label for="lines-select" style="font-size:.84rem;color:var(--text-secondary);">
Afficher Afficher
</label> </label>
<select id="lines-select" aria-label="Nombre de lignes"> <select id="lines-select" aria-label="Nombre de lignes">

18
public/assets/css/system.css
View File

@@ -105,9 +105,9 @@
font-family: ui-monospace, "SFMono-Regular", Consolas, monospace; font-family: ui-monospace, "SFMono-Regular", Consolas, monospace;
} }
.status-ok { color: var(--accent-green); font-weight: 600; font-size: .85rem; } .status-ok { color: var(--accent-green); font-weight: 600; font-size: .85rem; }
.status-warn { color: var(--warning); font-weight: 600; font-size: .85rem; } .status-warn { color: var(--warning); font-weight: 600; font-size: .85rem; }
.status-err { color: var(--error); font-weight: 600; font-size: .85rem; } .status-err { color: var(--error); font-weight: 600; font-size: .85rem; }
.status-unknown { color: var(--text-tertiary); font-weight: 600; font-size: .85rem; } .status-unknown { color: var(--text-tertiary); font-weight: 600; font-size: .85rem; }
.srv-section-title { .srv-section-title {
font-size: .82rem; font-size: .82rem;
@@ -157,9 +157,9 @@
.disk-bar { .disk-bar {
height: 100%; height: 100%;
border-radius: 3px; border-radius: 3px;
/* width and background-color are set via inline style using --disk-pct and --disk-color */ /* width and color driven by PHP via --disk-pct and --disk-color inline vars */
width: var(--disk-pct, 0%); width: var(--disk-pct, 0%);
background: var(--disk-color, #4caf50); background: var(--disk-color, var(--accent-green));
transition: width .3s; transition: width .3s;
} }
.disk-stats { .disk-stats {
@@ -170,7 +170,7 @@
margin-top: .25rem; margin-top: .25rem;
} }
/* ── Tab panel loading state ──────────────────────────────────────────────── */ /* ── Tab panel loading state ───────────────────────────────────────────── */
#sys-tab-panel { #sys-tab-panel {
min-height: 8rem; /* prevent layout jump while fetching */ min-height: 8rem; /* prevent layout jump while fetching */
position: relative; position: relative;
@@ -256,7 +256,7 @@
} }
.log-output { .log-output {
background: #0d0d0d; background: #0d0d0d;
border: 1px solid var(--admin-border); border: 1px solid #555;
border-radius: 4px; border-radius: 4px;
padding: 1rem; padding: 1rem;
overflow-x: auto; overflow-x: auto;
@@ -276,7 +276,7 @@
} }
.log-line + .log-line { border-top: 1px solid rgba(255,255,255,.03); } .log-line + .log-line { border-top: 1px solid rgba(255,255,255,.03); }
.log-crit { color: #ff7070; background: rgba(242, 90, 90, 0.12); } .log-crit { color: #ff7070; background: rgba(242, 90, 90, 0.12); }
.log-error { color: #f08080; } .log-error { color: var(--error); }
.log-warn { color: var(--warning); } .log-warn { color: var(--warning); }
.log-notice { color: #a0c8ff; } .log-notice { color: #a0c8ff; }
.log-line::before { .log-line::before {
@@ -332,7 +332,7 @@
} }
.sys-refresh-note a:hover { text-decoration: underline; } .sys-refresh-note a:hover { text-decoration: underline; }
/* ── Cache freshness badges ──────────────────────────────────────────────── */ /* ── Cache freshness badges ────────────────────────────────────────────── */
.sys-cache-badge { .sys-cache-badge {
display: inline-block; display: inline-block;
font-size: .68rem; font-size: .68rem;