Expand date filter select box width #8335
Conversation
|
Ship it. |
Widens the "All Dates" select box in the "Add Media" modal window, so that the full placeholder text is shown. Fix for #2202
| @@ -73,6 +73,11 @@ body.gutenberg-editor-page { | |||
| ul#adminmenu > li.current > a.current::after { | |||
| border-right-color: $white; | |||
| } | |||
|
|
|||
| .media-frame select.attachment-filters:last-of-type { | |||
There was a problem hiding this comment.
I wonder if this is a Core Bug and if it should be backported to Core somehow?
There was a problem hiding this comment.
I initially thought about submitting a ticket to trac for this, but I have never seen the issue outside of Gutenberg. I can test it a little later today to see if this is a core issue.
There was a problem hiding this comment.
Tested on WordPress install with & without Gutenberg, dropdown width issue seems to be only on media modal triggered by Gutenberg blocks.
There was a problem hiding this comment.
So the question is:
- What gutenberg styles are conflicting with this? Maybe we can fix it differently in that case.
- Another possibility is that it's a Core bug surfaced by Gutenberg
There was a problem hiding this comment.
This is just an issue because core (non-gutenberg media modal) has two dropdowns there, with the other being for filetype. It uses two declarations for them to appear side by side:
.media-modal-content .media-frame select.attachment-filters {
margin-top: 11px;
margin-right: 2%;
width: 42%;
width: (48% - 12px);.media-frame select.attachment-filters {
margin-top: 11px;
margin-right: 2%;
max-width: 42%;
max-width: calc(48% - 12px);In our case, we only have one, so those rules are basically chopping it in half. We need to override those.
There was a problem hiding this comment.
I think it's a core issue then. Because we're relying on wp.media APIs to open the modal, we're not hiding the second select with CSS which means if the wp.media allows us to show the media modal in that shape, it should also show it properly.
There was a problem hiding this comment.
I will submit a ticket on trac for this and reference the original issue #2202
There was a problem hiding this comment.
Ticket/Patch
https://core.trac.wordpress.org/ticket/44760
Widens the "All Dates" select box in the "Add Media" modal window, so that the full placeholder text is shown. Fix for #2202
Description
Added width: auto; and max-width: 100%; to edit-post/assets/stylesheets/main.scss
How has this been tested?
Browser tested in Chrome 67.0.3396.99 and FF 61.0.1, Windows 10
Screenshots
Before changes
After changes
Checklist: