Merge claude/1
This commit is contained in:
commit
297cdbb8af
@ -5,10 +5,11 @@
|
|||||||
/* Per-area identity hues. Each admin area owns one colour, reused going
|
/* Per-area identity hues. Each admin area owns one colour, reused going
|
||||||
forward (Overview action buttons today; page headers/accents next).
|
forward (Overview action buttons today; page headers/accents next).
|
||||||
The *-rgb companions feed rgba() tints. */
|
The *-rgb companions feed rgba() tints. */
|
||||||
--page-updates: #3f74d6; --page-updates-rgb: 63, 116, 214;
|
--page-updates: #4f8cff; --page-updates-rgb: 79, 140, 255; /* Update now */
|
||||||
--page-backups: #12936b; --page-backups-rgb: 18, 147, 107;
|
--page-verify: #1fb88a; --page-verify-rgb: 31, 184, 138; /* Verify — green by convention */
|
||||||
--page-ssh: #7150c8; --page-ssh-rgb: 113, 80, 200;
|
--page-backups: #4f8cff; --page-backups-rgb: 79, 140, 255; /* Backups — blue */
|
||||||
--page-system: #c2671d; --page-system-rgb: 194, 103, 29;
|
--page-ssh: #9b7bf0; --page-ssh-rgb: 155, 123, 240;
|
||||||
|
--page-system: #f0883e; --page-system-rgb: 240, 136, 62;
|
||||||
}
|
}
|
||||||
|
|
||||||
.admin-page {
|
.admin-page {
|
||||||
@ -132,22 +133,28 @@
|
|||||||
font-size: 0.875rem;
|
font-size: 0.875rem;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
/* Solid fill (not a translucent tint) so the glassy aurora bg can't bleed
|
/* Translucent hue tint + WHITE text: keeps the soft coloured look (solid
|
||||||
through and wash it out on nebula; white text reads on every hue. */
|
fills were too heavy) while staying legible on nebula's dark cards —
|
||||||
|
white on the tinted-over-dark surface has plenty of contrast, unlike the
|
||||||
|
coloured text it replaces. */
|
||||||
color: #fff;
|
color: #fff;
|
||||||
background: var(--page, var(--accent));
|
background: rgba(var(--page-rgb, var(--accent-rgb)), 0.16);
|
||||||
border: 1px solid rgba(0, 0, 0, 0.18);
|
border: 1px solid rgba(var(--page-rgb, var(--accent-rgb)), 0.42);
|
||||||
transition: filter 0.12s ease, transform 0.12s ease, box-shadow 0.12s ease;
|
transition: background 0.12s ease, transform 0.12s ease, box-shadow 0.12s ease;
|
||||||
}
|
}
|
||||||
.admin-action-btn:hover {
|
.admin-action-btn:hover {
|
||||||
filter: brightness(1.08);
|
background: rgba(var(--page-rgb, var(--accent-rgb)), 0.26);
|
||||||
transform: translateY(-1px);
|
transform: translateY(-1px);
|
||||||
box-shadow: 0 6px 16px rgba(var(--page-rgb, var(--accent-rgb)), 0.35);
|
|
||||||
}
|
}
|
||||||
.admin-action-btn:disabled { opacity: 0.6; cursor: default; transform: none; box-shadow: none; filter: none; }
|
.admin-action-btn:disabled { opacity: 0.6; cursor: default; transform: none; box-shadow: none; }
|
||||||
/* Primary action (e.g. Update now): same hue, a touch more emphasis. */
|
/* Primary action (Update now): a stronger tint so it stands out. */
|
||||||
.admin-action-btn.is-primary {
|
.admin-action-btn.is-primary {
|
||||||
box-shadow: 0 4px 14px rgba(var(--page-rgb, var(--accent-rgb)), 0.32);
|
background: rgba(var(--page-rgb, var(--accent-rgb)), 0.28);
|
||||||
|
border-color: rgba(var(--page-rgb, var(--accent-rgb)), 0.60);
|
||||||
|
}
|
||||||
|
.admin-action-btn.is-primary:hover {
|
||||||
|
background: rgba(var(--page-rgb, var(--accent-rgb)), 0.36);
|
||||||
|
box-shadow: 0 6px 16px rgba(var(--page-rgb, var(--accent-rgb)), 0.30);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ============================================================
|
/* ============================================================
|
||||||
|
|||||||
@ -170,10 +170,10 @@ class AdminOverview {
|
|||||||
if (vDisp) updBody += this.integrityLine(vDisp);
|
if (vDisp) updBody += this.integrityLine(vDisp);
|
||||||
|
|
||||||
// Update now takes priority when one's available; otherwise offer Verify now.
|
// Update now takes priority when one's available; otherwise offer Verify now.
|
||||||
const updPage = 'style="--page:var(--page-updates);--page-rgb:var(--page-updates-rgb)"';
|
// Update now = updates blue (primary); Verify = green (its own convention).
|
||||||
const updActions = (updAvail && upd.can_update)
|
const updActions = (updAvail && upd.can_update)
|
||||||
? `<button type="button" class="admin-action-btn is-primary" ${updPage} data-admin-update>${this.icon('update')}Update now</button>`
|
? `<button type="button" class="admin-action-btn is-primary" style="--page:var(--page-updates);--page-rgb:var(--page-updates-rgb)" data-admin-update>${this.icon('update')}Update now</button>`
|
||||||
: `<button type="button" class="admin-action-btn" ${updPage} data-admin-verify>${this.icon('verify')}Verify now</button>`;
|
: `<button type="button" class="admin-action-btn" style="--page:var(--page-verify);--page-rgb:var(--page-verify-rgb)" data-admin-verify>${this.icon('verify')}Verify now</button>`;
|
||||||
|
|
||||||
const updCard = this.card(
|
const updCard = this.card(
|
||||||
'Updates',
|
'Updates',
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user