Gutenberg: Media library module dates filter doesn't fully display

[paaljoachim]

As I click to add an image I notice that the All Dates dropdown is cropped.

[karmatosed]

Good catch, I can replicate.

[mrxkon]

Hello there! Trying to help so I picked up an easy one to try the workflow.

This could be 'easily' patched but the thing is that the css is actually coming from the media-views.css that resides in wp-includes. This is caused because there is 1 select box missing the 'All media items' so the widths of the single select box have to be replaced.

Question: is this something manageable through Gutenberg's files, meaning can we actually override the admin .css like we would do with a theme / plugin in any other case or is it something of a no-no situation so it should be handle on core somehow ?

If we could do it through Gutenberg I'd love a little file guidance as I haven't found a proper place to put the styles needed :D

[nielslange]

Related to https://github.com/WordPress/gutenberg/issues/4034. Potential fix can be found there as well.

[karmatosed]

Also worth noting: https://github.com/WordPress/gutenberg/issues/6111

[designsimply]

Tested and confirmed that "All dates" is still awkwardly cropped in the media modal.

^{Seen at http://alittletestblog.com/wp-admin/post.php?post=13999&action=edit running WordPress 4.9.7 and Gutenberg 3.3.0 using Firefox 61.0.1 on macOS 10.13.6.}

[ianbelanger79]

Hi All,

I have a solution for this issue, but I would like to refer back to @mrxkon previous comment.

Hello there! Trying to help so I picked up an easy one to try the workflow.

This could be 'easily' patched but the thing is that the css is actually coming from the media-views.css that resides in wp-includes. This is caused because there is 1 select box missing the 'All media items' so the widths of the single select box have to be replaced.

Question: is this something manageable through Gutenberg's files, meaning can we actually override the admin .css like we would do with a theme / plugin in any other case or is it something of a no-no situation so it should be handle on core somehow ?

If we could do it through Gutenberg I'd love a little file guidance as I haven't found a proper place to put the styles needed

Could I get some insight on this? Where should I put the CSS that is needed to fix this issue?

Thanks

[brandonpayton]

@mrxkon and @ianbelanger79, it looks like the best place to add a stopgap would be in a style.scss file that is a sibling and dependency of our MediaUpload component. If possible, it would be good to submit a patch to core for this issue and add a link to it with our Gutenberg fix, indicating the fix should be removed once it is patched in core.

[ajitbohra]

Ticket/Patch
https://core.trac.wordpress.org/ticket/44760

[youknowriad]

I'm closing as this is fixed in Gutenberg.