steve/wp-healthcheck
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Sidebar: brighter status dots so 'done' clearly reads as green

Browse Source 
The old #1a8917 green and 0.6rem dots were subtle enough on some
displays to read as dark grey. Bumping to a vivid #16a34a, 0.75rem
diameter, with a faint inset shadow for crispness on light
backgrounds. Other states adjusted to match the same brighter palette
(amber #f59e0b skipped, red #dc2626 blocked, neutral #9ca3af n/a).

Also dims the link text to a dark green for done rows via :has()
so the whole line reads as 'this is complete'.
This commit is contained in:
Steve Hanlon
2026-06-12 10:25:56 +01:00
parent fdca9c3079
commit b9dad0163b
1 changed files with 6 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
includes/admin-page.php
View File

@@ -88,11 +88,12 @@ function wph_inline_css(): string {
.wph-sidebar ol { margin:0; padding:0; list-style:none; }
.wph-sidebar li { padding:.18rem 0; }
.wph-sidebar a { text-decoration:none; }
.wph-sidebar .dot { display:inline-block; width:.6rem; height:.6rem; border-radius:50%; margin-right:.4rem; background:#dcdcde; vertical-align:middle; }
.wph-sidebar .dot-done { background:#1a8917; }
.wph-sidebar .dot-skipped { background:#b07a00; }
.wph-sidebar .dot-blocked { background:#c0392b; }
.wph-sidebar .dot-n_a { background:#646970; }
.wph-sidebar .dot { display:inline-block; width:.75rem; height:.75rem; border-radius:50%; margin-right:.45rem; background:#dcdcde; vertical-align:middle; box-shadow:0 0 0 1px rgba(0,0,0,.08) inset; }
.wph-sidebar .dot-done { background:#16a34a; box-shadow:0 0 0 1px rgba(0,0,0,.15) inset; }
.wph-sidebar .dot-skipped { background:#f59e0b; }
.wph-sidebar .dot-blocked { background:#dc2626; }
.wph-sidebar .dot-n_a { background:#9ca3af; }
.wph-sidebar li:has(.dot-done) a { color:#15803d; }
.wph-diff { background:#eef4fb; border:1px solid #cfe0f3; padding:.6rem 1rem; border-radius:6px; margin:.5rem 0; font-size:.9em; }
.wph-diff strong { display:inline-block; margin-right:.4rem; }
.wph-diff .delta-new { color:#c0392b; }