Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

User preference to adjust diff colors for color blindness #25680

Open
BGlasneck opened this issue Jul 4, 2023 · 6 comments
Open

User preference to adjust diff colors for color blindness #25680

BGlasneck opened this issue Jul 4, 2023 · 6 comments
Labels
topic/accessibility This issue/pull request wants to improve the accessibility type/feature Completely new functionality. Can only be merged if feature freeze is not active. type/proposal The new feature has not been accepted yet but needs to be discussed first.

Comments

@BGlasneck
Copy link

Feature Description

For red-green-blind people, the colors in a diff are difficult or impossible to distinguish.

Therefore it would be good if a user can specify in the settings that he is either color blind or can choose individual colors.

Here is an example of what a custom diff can look like.

Screenshots

No response
@BGlasneck BGlasneck added type/feature Completely new functionality. Can only be merged if feature freeze is not active. type/proposal The new feature has not been accepted yet but needs to be discussed first. labels Jul 4, 2023
@delvh
Copy link
Member

delvh commented Jul 4, 2023

I don't think that's the task of a setting.
Please think about adding a custom color-blind-friendly theme instead.
That will do the same thing in a non-intrusive way.
Once you have developed it, please also add a PR to https://gitea.com/gitea/awesome-gitea so that others can use it as well.

@delvh delvh added the issue/needs-feedback For bugs, we need more details. For features, the feature must be described in more detail label Jul 4, 2023
@techknowlogick techknowlogick added the topic/accessibility This issue/pull request wants to improve the accessibility label Jul 4, 2023
@silverwind
Copy link
Member

silverwind commented Jul 4, 2023 •
edited
Loading

High-contrast theme variants is something to consider for the future, but I don't think our themeing infrastructure is there yet to support it. First we need a way to set individual "default light" and "default dark" themes, then we can talk about additional variants.

@silverwind
Copy link
Member

silverwind commented Jul 5, 2023 •
edited
Loading

Notably, GitHub has two variants to each theme:

  • High-Contrast
  • Color-Blind

Instead of separate theme clones, these could be options in the theme, so for example when <html> has data-colorblind=true attribute, a selector :root[data-colorblind] { --color-red: #f00} can take effect to override variables in the base theme. This way, we avoid duplicating the whole theme and still have a fallback to base colors in case the theme does not have these variants.

@techknowlogick
Copy link
Member

fwiw there are many types of colour blindness: https://www.colourblindawareness.org/colour-blindness/types-of-colour-blindness/ so an enum should be used vs a bool

@yardenshoham yardenshoham mentioned this issue Sep 8, 2023
Merged
@GiteaBot GiteaBot closed this as completed Sep 8, 2023
@lunny lunny removed the issue/needs-feedback For bugs, we need more details. For features, the feature must be described in more detail label Sep 8, 2023
@lunny lunny reopened this Sep 8, 2023
@go-gitea go-gitea deleted a comment from GiteaBot Sep 8, 2023
@Infinoid
Copy link
Contributor

I've been looking at this recently. Our company has multiple color-blind people, and it would be nice if the Gitea UI were more legible to them. There are a few specific areas we've run into problems. And I have a question about how themes work, versus how they SHOULD work.

There seem to be 4 classes in the Gitea UI which affect colors of buttons and status boxes and such. These are "primary", "secondary", "red" and "green". It's the "red" and "green" ones that are confusing in the context of color-blind themes.

Example: the PR page for a PR which is open but not ready to merge, rendered for an admin (who can merge anyway, overriding branch protection rules). This page has a nice "open" label near the top is marked class="ui green label issue-state-label". The merge button at the bottom is meant to look scary, and is marked class="ui buttons merge-button red".

A theme for red-green color-blind people would assign different colors to both of these.
So, would you consider a PR which added a theme that sets --color-red to grey, and --color-green to blue? Or would these class terms need to be cleaned up first, before such a PR could be approved?

In any case, I'm wondering if using qualitative words, like "good" and "bad", or maybe "ready" and "override", or "happy" and "scary" or something, would be less confusing than "red" and "green".

@wxiaoguang wxiaoguang mentioned this issue Apr 21, 2024
Merged
@wxiaoguang
Copy link
Contributor

-> Initial support for colorblind-friendly themes #30625

wxiaoguang added a commit that referenced this issue Apr 23, 2024
@wxiaoguang
Initial support for colorblindness-friendly themes (#30625)
b79e3db 
Initial support for #25680

This PR only adds some simple styles from GitHub, it is big enough and
it focuses on adding the necessary framework-level supports. More styles
could be fine-tuned later.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
topic/accessibility This issue/pull request wants to improve the accessibility type/feature Completely new functionality. Can only be merged if feature freeze is not active. type/proposal The new feature has not been accepted yet but needs to be discussed first.
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
8 participants
@Infinoid @lunny @silverwind @techknowlogick @wxiaoguang @GiteaBot @delvh @BGlasneck