Make navigation placeholder state visible in dark themes.#29366
Conversation
|
Size Change: +33 B (0%) Total Size: 1.4 MB
ℹ️ View Unchanged
|
|
@annezazu just flagging you for thoughts on this one. |
|
Thanks for the flag and for jumping in on this so quickly. I have to admit that when selecting the block and the placeholders become more opaque, I still find it really hard to see. I imagine for a11y purposes this won't quite meet the bar. |
|
I don't know, the important part to see here is the plus button to add, and recent discussions around the setup state confusion to me suggests it's best to remove them entirely (0% opacity). What do you think? |
@jasmussen Did you mean remove the placeholder bars, so we only see the inserter? At least for me, I thought the block was broken when I first interacted with it. I associate the placeholder bars with loading requests, so only displaying the appender could work. |
|
As an aside TIL that Chrome devtools has a color contrast info in the color picker. Unfortunately parts of the editor appear to confuse it. |
|
Yes exactly, and for the reason you mention. Not necessarily in the placeholder step entirely, though I think that needs more love, but at least for the selected state. |
|
That sounds like a good step to take! |
2b33844 to
5e42c65
Compare
2fec4ed to
6f243ac
Compare
gwwar
left a comment
There was a problem hiding this comment.
Good improvement @jasmussen ! I think we might want to follow up on spacing for the vertical nav, but I think changes here are good as is, since the current placeholder is a bit wonky.
verticalplaceholder.mp4
Excellent point. I'll definitely put that on my list. Thanks for the reviews! |



Description
Fixes #29235.
This makes the setup state slightly more opaque in dark themes, when selected.
How has this been tested?
Use TT1 blocks, set the background color to black in the site editor, text to white, then insert a navigation block and start empty. Then select and unselect to see the difference.
Screenshots
Types of changes
The setup state is meant to be purely decorative, so there isn't a contrast ratio to meet. What's important is that the plus button is visible against a dark background.
Checklist: