Media toolbar spacing inconsistent across views

[desrosj]

The media toolbar is present on both list and grid views. The padding on the dropdowns and buttons, though, is inconsistent.

[desrosj]

Note the scrunched dropdowns/buttons

[desrosj]

Note the nicely spaced dropdowns and buttons

[seusmaniqbal]

Set margin for Media toolbar dropdowns

[ianbelanger]

SVN version of changes

[ianbelanger]

Tested patch on Lenovo ThinkPad Windows 10, in Firefox 59.0.2 and Chrome 66.0.3359.139. Changes looked good in both browsers. Also uploaded svn version of patch.

[subrataemfluence]

I applied the patch and it looks much better.

However, in order to keep the spacing consistent with media grid view the margin I believe needs to be 6px instead of 8px.

.post-type-attachment .wp-filter select {
    margin-right: 6px;
}

[ianbelanger]

Refreshed patch and tested with current trunk

[sabernhardt]

6px right margin and 0 margin for other sides of select elements in List View filter bar

[sabernhardt]

The view-switch container ​adds 4 pixels to the right margin in Grid mode to account for the lack of whitespace between elements. The select elements have a 10-pixel right margin in Grid mode, so a 6-pixel margin plus the space would be consistent with that. I also set the other sides to zero margin in List mode to remove the 1-pixel left margin.

If you test within the 783-900 pixel range, the select elements have a larger font size and padding in Grid mode, but that does not relate to the spacing.

[pooja1210]

Hi,

Patch report for -https://core.trac.wordpress.org/attachment/ticket/43904/43904.5.diff

Environment:
WordPress: v6.2.2
OS: Mac
Browser: Chrome

Expected Result: Media toolbar spacing should be consistent for both list and grid ☑️

Screenshots:
Before: ​https://prnt.sc/lcjlIKIDZl3F

After: ​https://prnt.sc/kHbcer79x_6u

Thanks!