Automatically adjust block colors to have a contrast ratio of 4.5 #9973
Conversation
This file contains 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
|
also, should be noted that turning this flag on will fix microsoft/pxt-arcade#4870 |
riknoll
changed the title
srietkerk
reviewed
Apr 16, 2024
|
Also, is there a reason that |
|
ah, that would be because i missed on start! will fix |
srietkerk
approved these changes
Apr 16, 2024
| @@ -8,6 +8,12 @@ export function initOnStart() { | |||
| const onStartDef = pxt.blocks.getBlockDefinition(ts.pxtc.ON_START_TYPE); | |||
| Blockly.Blocks[ts.pxtc.ON_START_TYPE] = { | |||
| init: function () { | |||
| let colorOverride = pxt.appTarget.runtime?.onStartColor; | |||
There was a problem hiding this comment.
So we special-case the onStart block? Why?
There was a problem hiding this comment.
on-start is kind of a special builtin block because we give targets a lot of control over where it shows up. For example, in micro:bit it's in the basic category but everywhere else it's in loops. iirc we added this option for cue because they had an on-start that doesn't show up in any category, it was just always on the workspace and couldn't be deleted.
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.
Motivated by: microsoft/pxt-arcade#4870
This PR adds a little code to automatically adjust all block background colors to have a contrast ratio of at least 4.5 with white foreground text. The algorithm I'm using is pretty dumb: I just lower the luminosity until a color with the correct contrast ratio is generated and cache the result.
I placed this behind a feature flag for now because the general consensus is that this makes all the blocks look duller/uglier and creates a breaking change with old screenshots. The goal should be for us to eventually turn this on in all targets; we might have to adjust the base colors of some categories to make them more visually appealing though (arrays is particularly ugly).
Here is an upload target in micro:bit with the feature turned on:
https://makecode.microbit.org/app/36f327a321d404020e3804ed55f5a3567b2e929f-3d8dd326ca