Update the float on the Spinner to none

[mapk]

Description

Fixes #18199. It appears that changing the float on the spinner component to none instead of right seems to work fine.

How has this been tested?

I tested the visual change in a few places like:

• Uploading an image to a block.
• Switching to the Media Library from an Image block.
• Publishing a post.

Each instance there seemed to work just fine visually. I only tested in Firefox 71.0.

Screenshots

Image block

Storybook

Types of changes

Non-breaking CSS changes.

Checklist:

• My code is tested.
• My code follows the WordPress code style.
• My code follows the accessibility standards.
• My code has proper inline documentation.
• I've included developer documentation if appropriate.
• I've updated all React Native files affected by any refactorings/renamings in this PR. .

[chrisvanpatten]

I would love this to get merged (I’m sick of overriding this in my own code) but there are a few places where the spinner needs to be floated, such as when it’s shown above the compatibility mode metaboxes during saving, which would need to be updated. There are also a bunch of cases where the float is removed via CSS in specific instances, so that CSS would end up being redundant.

[mapk]

@chrisvanpatten, Thanks for the feedback! I checked the meta boxes and that seems to work still.

I've also updated a couple other files that were overriding the float and removed that style. This still should be tested by others before merging though.

[mapk]

Also tested in the link interface and it appears correctly there too.

[mapk]

Should I keep this as float:none; or just remove it altogether? @jasmussen any thoughts?

[jasmussen]

Interesting, if the float does not appear to regress anything, definitely remove it altogether. Floats are the worst, and if there's truly no downside to removing it, out it goes.

A float left or right literally takes an item out of the flow of content, giving it a zero height footprint (with no margins), that would be the only thing to look for, the non floated thing pushing things down.

[mapk]

Thanks @jasmussen ✋ I've removed the float completely now.

[mapk]

After removing the float completely, this can use a bit more testing. I've tested on the link creation popover, the uploading of images and it all looks good still.

[jasmussen]

This is working well for me, code looks good and a float really should fix more things than it breaks.

I tested the most obvious spinner locations. From a brief code search it looks like the spinner is used in these places:

• Block directory search results
• Media upload progress
• URL input
• Block placeholder
• Embeds loading
• Galleries loading
• Images loading
• Latest posts loading
• Metaboxes saving
• Featured images doing something
• Post publish panel saving

Those are the things to look for.

[chrisvanpatten]

Thanks @mapk! Excited to put this to use :)