element-hq / element-hq/element-web
Reduce the saturation of the red
- Dominant language
- TypeScript
- Stars
- 13.5k
- Forks
- 2.8k
- PR merge metrics
- PR metrics pending
Description
### Your use case
#### What would you like to do?
Reduce the saturation of the red used for buttons, mention pills, and notification bubbles (perhaps with exception to the spaces notification as that uses white text and has a slightly darker red for better contrast).
#### Why would you like to do it?
Black text has relatively poor contrast against this particular shade of red, which reduces legibility and makes the content less visually accessible.
### Have you considered any alternatives?
Make text and icons on red mention pills, notification bubbles and the end-call button - white.
White provides better contrast against the current red background, making the text and icons easier to read and distinguish.
### Additional context
The foreground content should not visually compete with its background.
Contributor guide
Research direction
The issue names buttons, mention pills, notification bubbles, and the end-call button but gives no file or test entry point. Start by locating the shared styles or color definitions for those components; done means the red is less saturated and foreground content has improved contrast, while preserving legibility for the spaces notification.
Written by the indexing model from the issue text.
Assessment
- Domain
- accessibility, design, frontend
- Issue type
- Feature
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Active
- Clarity
- Mostly clear
- Newbie friendliness
- 58/100