Fix select box regression.

[jasmussen]

Fixes #6326.

This "undoes" a change to the select box styling, and polishes the focus style as well.

The regression was to introduce a padding change that conflicted with upstream select box styles. This essentially reverts that. This also polishes the focus styles a bit.

Screenshots. Chrome mac:

Chrome Windows:

Windows high contrast:

All those are focused.

Steps to test:

• Verify that select boxes look and behave right in all the browsers and platforms. Verify that text is never cropped inside.

[aduth]

What's the context for the original change which is being undone here?

[jasmussen]

Looks like I forgot to ask for reviews on this :D

What's the context for the original change which is being undone here?

The context is largely this PR: #5605 and subsequently this ticket: #4963

That is — input styles are heavily (and I might say heavy-handedly) styled in WordPress up-stream.

Because of how Gutenberg uses input fields and text areas for many things that aren't traditional form elements (the block-list is one wonderful example), we kind of have to make our own styles. Until 5605 was merged, we had a big mix of styles, which was especially jarring when you compared the input style of the upstream-styled Excerpt field in the sidebar, to the Shortcode input box which was sort of unstyled then re-styled. Kind of a mess.

5605 was an attempt to rectify that, and clean things up, despite having to override upstream styles. I've created mix-ins to make the focus styles more reusable in https://github.com/WordPress/gutenberg/blob/master/edit-post/assets/stylesheets/_mixins.scss#L180, and hope that one day we can migrate those upstream so we don't have to override anything.

[notnownikki]

Looks good to me in all the browsers I have (firefox, chrome)

[jasmussen]

Thanks. Merging as it fixes an issue. If we are to revisit overriding styles in the first place, probably best done separately.