-
Notifications
You must be signed in to change notification settings - Fork 4.2k
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
Post Schedule Panel: Remove text overflow ellipsis #56319
Conversation
Size Change: +53 B (0%) Total Size: 1.7 MB
ℹ️ View Unchanged
|
I think it should be fixed now. |
justify-content: flex-start !important; | ||
align-items: flex-start !important; |
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.
Maybe explain why this needs to be conditional now?
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.
Good remark, the conditional style is actually not needed now.
I pushed a commit that updates these buttons to use the new 40px default sizing. Appreciate this touches more files so feel free to revert if that's beyond scope. I felt it was a neater approach than adding custom overrides. The multi-line button still looks a bit funky, but that's a separate issue. |
@jameskoster There's actually a lot of buttons that needs updating. There's buttons (and not controls) that are visible only in the post editor, in some very specific conditions... So I'm a bit hesitant to keep this change. |
683157d
to
5a5dc78
Compare
Ok I've reverted the button size changes @jameskoster I think these are valuable changes but should probably be explored separately of the current issue in a wholistic way. |
Oh I just reverted too 🙈 |
white-space: nowrap; | ||
white-space: unset; | ||
height: auto; | ||
padding: 10px 12px; |
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.
This padding is creating a 35px button for me. Maybe use min-height: $button-size
instead?
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.
min height doesn't work properly for multi-line buttons. We can have both though.
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.
Ok so I added a line height using pixels and a comment explaining why.
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.
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.
Should we use the $grid-unit-* vars?
We can't, button block is not really using them and 10px is not really there. Potentially we can use calculations.
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.
Trying calculations.
5cfbcca
to
c94e615
Compare
height: auto; | ||
|
||
// The line height + the padding should be the same as the button size. | ||
padding: ( ( $button-size - $grid-unit-20 ) / 2 ) 12px; |
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.
Looks like this introduced a deprecation warning when building Gutenberg. Tiny follow-up PR over in #56412 🙂
Follow-up to #56196
Closes #56262
What?
The PostSchedule unification PR kept the format of the post editor (full date visible) but kept the style of the site editor (text overflow cut using an ellipsis). This PR restores the styling of the post editor which used to render the full date.
Testing Instructions
1- Schedule a post in the future
2- Notice that the date is shown fully.