From 4ec627c0b1608bf610550f6a7604eaf1d73e3b6f Mon Sep 17 00:00:00 2001 From: Daniel Gibson Date: Sun, 24 Nov 2024 05:34:08 +0100 Subject: [PATCH] Improve colors used by colorblind-friendly forgejo themes I found them to have too little contrast so I tweaked them a bit. Screenshots and discussion can be found at: https://codeberg.org/forgejo/forgejo/pulls/1746#issuecomment-2442469 Thanks a lot to @jpkhawam for creating the colorblind themes and for helping me improving my changes even further! :) --- .../theme-forgejo-dark-deuteranopia-protanopia.css | 6 ++---- web_src/css/themes/theme-forgejo-dark-tritanopia.css | 6 ++---- .../theme-forgejo-light-deuteranopia-protanopia.css | 12 ++++++------ .../css/themes/theme-forgejo-light-tritanopia.css | 12 ++++++------ 4 files changed, 16 insertions(+), 20 deletions(-) diff --git a/web_src/css/themes/theme-forgejo-dark-deuteranopia-protanopia.css b/web_src/css/themes/theme-forgejo-dark-deuteranopia-protanopia.css index b30cfd6b23..e0765aba4a 100644 --- a/web_src/css/themes/theme-forgejo-dark-deuteranopia-protanopia.css +++ b/web_src/css/themes/theme-forgejo-dark-deuteranopia-protanopia.css @@ -1,11 +1,9 @@ @import "./theme-forgejo-dark.css"; :root { - --color-diff-removed-word-bg: #693f17; - --color-diff-removed-row-border: #693f17; - --color-diff-removed-row-bg: #221b17; + /* removed rows/words: use red colors from vanilla forgejo-dark */ --color-diff-added-word-bg: #214d88; --color-diff-added-row-border: #214d88; - --color-diff-added-row-bg: #13233a; + --color-diff-added-row-bg: #18184f; --color-code-bg: #0d1117; } diff --git a/web_src/css/themes/theme-forgejo-dark-tritanopia.css b/web_src/css/themes/theme-forgejo-dark-tritanopia.css index aefdaa1bf7..e4fc303481 100644 --- a/web_src/css/themes/theme-forgejo-dark-tritanopia.css +++ b/web_src/css/themes/theme-forgejo-dark-tritanopia.css @@ -1,11 +1,9 @@ @import "./theme-forgejo-dark.css"; :root { - --color-diff-removed-word-bg: #792e2e; - --color-diff-removed-row-border: #792e2e; - --color-diff-removed-row-bg: #25171c; + /* removed rows/words: use red colors from vanilla forgejo-dark */ --color-diff-added-word-bg: #214d88; --color-diff-added-row-border: #214d88; - --color-diff-added-row-bg: #13233a; + --color-diff-added-row-bg: #152846; --color-code-bg: #0d1117; } diff --git a/web_src/css/themes/theme-forgejo-light-deuteranopia-protanopia.css b/web_src/css/themes/theme-forgejo-light-deuteranopia-protanopia.css index eb48b7598d..8744cbb581 100644 --- a/web_src/css/themes/theme-forgejo-light-deuteranopia-protanopia.css +++ b/web_src/css/themes/theme-forgejo-light-deuteranopia-protanopia.css @@ -1,11 +1,11 @@ @import "./theme-forgejo-light.css"; :root { - --color-diff-removed-word-bg: #ffdbb0; - --color-diff-removed-row-border: #ffdbb0; - --color-diff-removed-row-bg: #fffaf3; - --color-diff-added-word-bg: #b1dbff; - --color-diff-added-row-border: #b1dbff; - --color-diff-added-row-bg: #eef9ff; + --color-diff-removed-word-bg: #c8c850; + --color-diff-removed-row-border: #c8c850; + --color-diff-removed-row-bg: #ffecc4; + --color-diff-added-word-bg: #b8c0ff; + --color-diff-added-row-border: #b8c0ff; + --color-diff-added-row-bg: #e0e0ff; --color-code-bg: #ffffff; } diff --git a/web_src/css/themes/theme-forgejo-light-tritanopia.css b/web_src/css/themes/theme-forgejo-light-tritanopia.css index 208da5597f..3f875e4a7f 100644 --- a/web_src/css/themes/theme-forgejo-light-tritanopia.css +++ b/web_src/css/themes/theme-forgejo-light-tritanopia.css @@ -1,11 +1,11 @@ @import "./theme-forgejo-light.css"; :root { - --color-diff-removed-word-bg: #ffd0ce; - --color-diff-removed-row-border: #ffd0ce; - --color-diff-removed-row-bg: #fff5f4; - --color-diff-added-word-bg: #b1dbff; - --color-diff-added-row-border: #eef9ff; - --color-diff-added-row-bg: #eef9ff; + --color-diff-removed-word-bg: #ffb8c0; + --color-diff-removed-row-border: #ffb8c0; + --color-diff-removed-row-bg: #ffd8d8; + --color-diff-added-word-bg: #b8c0ff; + --color-diff-added-row-border: #b8c0ff; + --color-diff-added-row-bg: #c0e8ff; --color-code-bg: #ffffff; }