From b04f2420c19e513e5a06b5fa30fb96028509dc69 Mon Sep 17 00:00:00 2001 From: Bryce Kwon Date: Thu, 29 Oct 2026 13:31:08 -1000 Subject: Bring every text colour up to WCAG AA Muted, faint, the footer and the month and year ages fell short of 4.5:1 on the backgrounds they sit on, the row stripes and line number cells among them, and links inside sentences differed from the text around them only by colour. Each grey is now the lightest that clears 4.5:1 on its darkest background, with months stepped between weeks and years so the age fade keeps all six steps, and links in running text are underlined. --- assets/cgit.css | 23 ++++++++++++++--------- 1 file changed, 14 insertions(+), 9 deletions(-) diff --git a/assets/cgit.css b/assets/cgit.css index 1f32196..7cb1e07 100644 --- a/assets/cgit.css +++ b/assets/cgit.css @@ -3,9 +3,9 @@ div#cgit { --bg: light-dark(#ffffff, #1b1b1b); --fg: light-dark(#333333, #d6d6d6); - --muted: light-dark(#777777, #9a9a9a); - --faint: light-dark(#888888, #7f7f7f); - --footer-fg: light-dark(#bbbbbb, #666666); + --muted: light-dark(#6c6c6c, #9a9a9a); + --faint: light-dark(#717171, #8a8a8a); + --footer-fg: light-dark(#767676, #838383); --link: light-dark(#0053b3, #6ea8fe); --border: light-dark(#cccccc, #3a3a3a); @@ -42,8 +42,8 @@ div#cgit { --age-hours: light-dark(#008000, #5cb85c); --age-days: light-dark(#004400, #7cba7c); --age-weeks: light-dark(#444444, #a0a0a0); - --age-months: light-dark(#888888, #8a8a8a); - --age-years: light-dark(#bbbbbb, #6a6a6a); + --age-months: light-dark(#5a5a5a, #959595); + --age-years: light-dark(#717171, #8a8a8a); --deco-fg: light-dark(#000000, #f0f0f0); --branch-bg: light-dark(#88ff88, #1c5c2c); @@ -117,6 +117,15 @@ div#cgit a:hover { text-decoration: underline; } +div#cgit .markdown a, +div#cgit div.blob-header a, +div#cgit div.commit-msg a, +div#cgit div.notes a, +div#cgit div.truncated a, +div#cgit table.log th a { + text-decoration: underline; +} + div#cgit img, div#cgit video { border: none; @@ -363,10 +372,6 @@ div#cgit .footer { div#cgit .footer a { color: var(--footer-fg); - text-decoration: none; -} - -div#cgit .footer a:hover { text-decoration: underline; } -- cgit