From patchwork Wed Oct 5 14:24:05 2022 Content-Type: text/plain; charset="utf-8" MIME-Version: 1.0 Content-Transfer-Encoding: 7bit X-Patchwork-Submitter: Robin Jarry X-Patchwork-Id: 1686360 Return-Path: X-Original-To: incoming@patchwork.ozlabs.org Delivered-To: patchwork-incoming@legolas.ozlabs.org Authentication-Results: legolas.ozlabs.org; spf=pass (sender SPF authorized) smtp.mailfrom=lists.ozlabs.org (client-ip=2404:9400:2:0:216:3eff:fee1:b9f1; helo=lists.ozlabs.org; envelope-from=patchwork-bounces+incoming=patchwork.ozlabs.org@lists.ozlabs.org; receiver=) Authentication-Results: legolas.ozlabs.org; dkim=fail reason="signature verification failed" (2048-bit key; unprotected) header.d=jarry.cc header.i=@jarry.cc header.a=rsa-sha256 header.s=gm1 header.b=FONxfVfP; dkim-atps=neutral Received: from lists.ozlabs.org (lists.ozlabs.org [IPv6:2404:9400:2:0:216:3eff:fee1:b9f1]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature ECDSA (P-384) server-digest SHA384) (No client certificate requested) by legolas.ozlabs.org (Postfix) with ESMTPS id 4MjHCC095Cz20Pd for ; Thu, 6 Oct 2022 01:34:30 +1100 (AEDT) Received: from boromir.ozlabs.org (localhost [IPv6:::1]) by lists.ozlabs.org (Postfix) with ESMTP id 4MjHCB0DHKz3bjZ for ; Thu, 6 Oct 2022 01:34:30 +1100 (AEDT) Authentication-Results: lists.ozlabs.org; dkim=fail reason="signature verification failed" (2048-bit key; unprotected) header.d=jarry.cc header.i=@jarry.cc header.a=rsa-sha256 header.s=gm1 header.b=FONxfVfP; dkim-atps=neutral X-Original-To: patchwork@lists.ozlabs.org Delivered-To: patchwork@lists.ozlabs.org Authentication-Results: lists.ozlabs.org; spf=pass (sender SPF authorized) smtp.mailfrom=jarry.cc (client-ip=2001:4b98:dc4:8::240; helo=mslow1.mail.gandi.net; envelope-from=robin@jarry.cc; receiver=) Authentication-Results: lists.ozlabs.org; dkim=pass (2048-bit key; unprotected) header.d=jarry.cc header.i=@jarry.cc header.a=rsa-sha256 header.s=gm1 header.b=FONxfVfP; dkim-atps=neutral X-Greylist: delayed 599 seconds by postgrey-1.36 at boromir; Thu, 06 Oct 2022 01:34:24 AEDT Received: from mslow1.mail.gandi.net (mslow1.mail.gandi.net [IPv6:2001:4b98:dc4:8::240]) (using TLSv1.2 with cipher ECDHE-RSA-AES256-GCM-SHA384 (256/256 bits)) (No client certificate requested) by lists.ozlabs.org (Postfix) with ESMTPS id 4MjHC502yYz2yPN for ; Thu, 6 Oct 2022 01:34:24 +1100 (AEDT) Received: from relay3-d.mail.gandi.net (unknown [IPv6:2001:4b98:dc4:8::223]) by mslow1.mail.gandi.net (Postfix) with ESMTP id 4B8DACCD0C for ; Wed, 5 Oct 2022 14:24:32 +0000 (UTC) Received: (Authenticated sender: robin@jarry.cc) by mail.gandi.net (Postfix) with ESMTPSA id 9D19B60006; Wed, 5 Oct 2022 14:24:10 +0000 (UTC) DKIM-Signature: v=1; a=rsa-sha256; c=relaxed/relaxed; d=jarry.cc; s=gm1; t=1664979850; h=from:from:reply-to:subject:subject:date:date:message-id:message-id: to:to:cc:cc:mime-version:mime-version: content-transfer-encoding:content-transfer-encoding; bh=UBCcP2WDrUigSC+Ge5d6eTXvCObk+brAvEYS2z0/5g4=; b=FONxfVfPERrKs4Z/kHf8188815rrnty5RFLKY/s236ibla6DDOL6NTiT19KkpWiG3c/nQJ i3Fb28DJIgTZkMUeUiAFsloLdnQmk1+FOhp0DqTaREJFxwAhvvcr1Zz8n2n6WxTwZcuc7G xP/x+Us5G0TPb9/U+SgCDBZL245bbsJ6xw78Z5PAY3/RYVlQROjA9sx6vhcIy30CjK52dR Sqax7Xl7YT5aAVZfA0jJxhban5K+jWuvsJyOS+V4snE+w3FfN54Bn8rACFd26TIjxR13AH Dxy6Rnh5NtwrvZzjeFqvB79J4NZwgdotpPA/Ni/fGFe/RVHx9nuBxjL7FXXErw== From: Robin Jarry To: patchwork@lists.ozlabs.org Subject: [PATCH] css: make diff colors more accessible Date: Wed, 5 Oct 2022 16:24:05 +0200 Message-Id: <20221005142405.20896-1-robin@jarry.cc> X-Mailer: git-send-email 2.37.3 MIME-Version: 1.0 X-BeenThere: patchwork@lists.ozlabs.org X-Mailman-Version: 2.1.29 Precedence: list List-Id: Patchwork development List-Unsubscribe: , List-Archive: List-Post: List-Help: List-Subscribe: , Errors-To: patchwork-bounces+incoming=patchwork.ozlabs.org@lists.ozlabs.org Sender: "Patchwork" The colors used to display patch diffs are confusing. The context color is very similar to the added line color and the contrast between added and removed lines is very low. Originally, the choice of purple/blue (instead of the more common red/green palette) may have been made with colorblindness accessibility in mind. However, after inspecting the current colors with colorblindness "simulators", I found that the low contrast was consistent no matter what vision deficiency (if any) you might have. Update the colors to use a more common red/green palette. Add background colors to increase contrast for colorblind people. Use less confusing colors for context and diff hunks. Use normal line height to prevent background colors from overlapping. Use a different color for email quotes (blue) to avoid confusion with added lines. I have made a compilation of the current and updated color palette previews for normal vision and all common color deficiencies. I also included the same diff as seen from Github interface for reference. Link: http://files.diabeteman.com/patchwork-diff-colors/ Signed-off-by: Robin Jarry --- htdocs/css/style.css | 16 ++++++++-------- ...-colors-more-accessible-82eda58a89984d46.yaml | 5 +++++ 2 files changed, 13 insertions(+), 8 deletions(-) create mode 100644 releasenotes/notes/make-diff-colors-more-accessible-82eda58a89984d46.yaml diff --git a/htdocs/css/style.css b/htdocs/css/style.css index 9156aa6ee073..1a739510924c 100644 --- a/htdocs/css/style.css +++ b/htdocs/css/style.css @@ -17,7 +17,7 @@ h2 a, h2 span { } pre { - line-height: 110%; + line-height: normal; background-color: white; border-radius: 0; } @@ -354,15 +354,15 @@ button[class^=comment-action] { } .quote { - color: #007f00; + color: #365cb5; } -span.p_header { color: #2e8b57; font-weight: bold; } -span.p_chunk { color: #a52a2a; font-weight: bold; } -span.p_context { color: #a020f0; } -span.p_add { color: #008b8b; } -span.p_del { color: #6a5acd; } -span.p_mod { color: #0000ff; } +span.p_header { font-weight: bold; } +span.p_chunk { color: #329fb0; font-weight: bold; } +span.p_context { } +span.p_add { color: #1b9d09; background-color: #edffed; } +span.p_del { color: #c80101; background-color: #ffe2e2; } +span.p_mod { color: #a020f0; } .acked-by { color: #2d4566; diff --git a/releasenotes/notes/make-diff-colors-more-accessible-82eda58a89984d46.yaml b/releasenotes/notes/make-diff-colors-more-accessible-82eda58a89984d46.yaml new file mode 100644 index 000000000000..f65995e51d9a --- /dev/null +++ b/releasenotes/notes/make-diff-colors-more-accessible-82eda58a89984d46.yaml @@ -0,0 +1,5 @@ +--- +other: + - | + The patch diff color palette was modified to make it more accessible for + all users, including those with common color deficiencies.