-
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
Update some visual details in the add-template modal(s) #50143
Conversation
Size Change: +1.64 kB (0%) Total Size: 1.37 MB
ℹ️ View Unchanged
|
Thanks for all the attention to detail here. Just connecting the dots with this border feedback I gave here, it seems okay to keep the gray borders in the resting state, perhaps make them lighter, similar to style buttons. And then if it still works, just omit the borders from the hover state. |
Copy pasting my reply from the issue :)
|
@jasmussen how do you feel about this? add-template.mp4 |
I liked the big buttons, but acknowledge they only work with the gray borders, which I still like. Big tappable buttons, even in their resting state, not just on hover. It's not the strongest opinion in the world, and I do appreciate that the hover state of the list-items now line up. But it might still be good to look at this button type in the larger range of things we want to do with page and template modals, it might work converting it all to lists here, but we might still need the larger buttons elsewhere. Normally I agree the borders add noise, in this case, I think it's about managing the whitespace. |
This reverts commit 6f4cc2c.
Flaky tests detected in 53a85c8. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/4863283684
|
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.
What?
Part of #50134.
Updates the appearance of the add-template modal contents to be consistent with itself, and other parts of the UI.
In the first step, the buttons are now more closely aligned to similar button styles, IE any
tertiary
button variants, and blocks in the Inserter.The list items in the second step now resemble the suggestions in the Command Center.
How?
Mostly css. Plus a couple of instances of the
Text
component.Side note: We should update the
Text
component to include the correct line-height on thebody
size.Testing Instructions
Before
before.mp4
After
add-template-appearance.mp4