-
Notifications
You must be signed in to change notification settings - Fork 4.3k
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.
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
Remove box shadow from the default appender inserter button hover state #14936
Remove box shadow from the default appender inserter button hover state #14936
Conversation
Fixes #14853. This removes the box shadow on the inserter button that appears to the left of the default block appender (or to the right on mobile). This brings the hover state in line with the hover state for the sibling inserter.
One design consideration here: This makes the inserter hover match that of the sibling inserter, but it also takes it out of a alignment with the hover state of the mover blocks that also appear on the left. I'm not sure that's actually better. 😕 (Also, I'm noticing for the first time that the inserter button shows up way to the left of where the block mover icons appear... that seems like a separate bug to fix. 😄) |
I've always felt that a circle button with a circle icon felt a little forced. Kinda like wearing a bands t-shirt to the concert. 😄
Wonder how this would look with a regular ➕ icon, in a round button with a border? It would essentially look the same but perhaps a little more noticeable/actionable? |
I think it's a small improvement, namely because the circle shape didn't work super duper for the inserter as Marty notes. I think this is better. But yes, let's definitely continue to iterate these style separately. I'm exploring SUUUPER early button hover/focus states in this screenshot, but they are so early that I share it only as a link not an inline image :D — but in any case, once we have a solid style for buttons, it'd be good to look at them all holistically. One important consideration — the movers have backgrounds because they may overlap other content in nested situations (where even the neutral state has a background), like this: That neutral background doesn't look great at all, btw and is also worth tightening up. But no, the problem doesn't extend to the button this PR touches, because in nested contexts, the plus is inside, and on the right: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ship it!
Thanks folks! |
Fixes WordPress#14853. This removes the box shadow on the inserter button that appears to the left of the default block appender (or to the right on mobile). This brings the hover state in line with the hover state for the sibling inserter.
Fixes #14853. This removes the box shadow on the inserter button that appears to the left of the default block appender (or to the right on mobile). This brings the hover state in line with the hover state for the sibling inserter.
Fixes #14853. This removes the box shadow on the inserter button that appears to the left of the default block appender (or to the right on mobile). This brings the hover state in line with the hover state for the sibling inserter.
Fixes #14853.
This removes the box shadow on the inserter button that appears to the left of the default block appender (or to the right on mobile).
This brings the hover state in line with the hover state for the sibling inserter.
Before:
After: