Fix/link contrast editor #1231
Closed
Fix/link contrast editor #1231
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Updated anchor link color from greyscale-500 to greyscale-600 for better accessibility and WCAG compliance. Signed-off-by: Cyril <c.gromoff@gmail.com>
Ensures WCAG-compliant text contrast on colored backgrounds (yellow, orange, red, grey) inside bullet list items only. Signed-off-by: Cyril <c.gromoff@gmail.com>
Reverts the initial fix that used forced color overrides (like grayscale 700) on bullet list items with same text/background color. This implementation was not effective due to BlockNote's internal styles and specificity. A more robust solution should be implemented directly inside BlockNote.js. Signed-off-by: Cyril <c.gromoff@gmail.com>
AntoLC
reviewed
Jul 28, 2025
| } | ||
| a { | ||
| color: var(--c--theme--colors--greyscale-500); | ||
| color: var(--c--theme--colors--greyscale-700); |
There was a problem hiding this comment.
If you add 700 you will not have any color distinction between your text and your link on the other hand:
With 500 (as before):
With 700 (new change):
I am fine with 700 if you took that into account.
|
Closing this PR — no longer needed / replaced by another PR 1232 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Purpose
Improve text accessibility by enhancing the contrast of links on colored backgrounds.
Proposal
Changed link color from greyscale-500 to greyscale-700 to make it easier to read on colored backgrounds.
Tried to fix the case where text color === background color (like red on red) using CSS overrides.
But it didn’t work, because BlockNote.js uses inline styles that are too strong to override.
We may need to fix this directly inside BlockNote.js to allow better control of contrast for colored texts.l
External contributions
Thank you for your contribution! 🎉
Please ensure the following items are checked before submitting your pull request:
git commit --signoff(DCO compliance)git commit -S)<gitmoji>(type) title description## [Unreleased]section (if noticeable change)