`showRemoveButtonAfterComplete` breaks dashboard styling

[Murderlon]

The remove button is on top of the progress icon. Surfaced in #3305.

[arturi]

We could hide the complete checkmark when showing remove button, but what if we need to indicate the file that can be removed is uploaded, @nqst? Should we move the checkmark to the center?

[nqst]

Should we move the checkmark to the center?

I like this idea, yeah. I'd limit such an appearance for that particular case only, though.

Quick sketch:

[arturi]

I'd limit such an appearance for that particular case only, though

Every time new conditions come up, I think about supporting it and having if if if if if if or ? : '' and special .uppy-Dashboard--has-showRemoveButtonAfterComplete CSS stuff, not to mention separate SVGs that make Uppy larger. This is a general concern, not necessarily big deal in this case.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[fnimick]

I use the following CSS to move the indicator to the upper left (or right, for rtl) of the image displayed, so it doesn't collide with the action button.

.uppy-Dashboard-Item .uppy-Dashboard-Item-progress {
    left: 0;
    right: 0;
    display: flex;
    justify-content: flex-start;
    margin-left: -11px;
    margin-right: -11px;
}