Video Block: Update Poster Image UI

[melchoyce]

Based on some work on #7673 and #9457, I want to propose an updated UI for the Poster Image feature in the Video Block:

This would:

• Split it out into its own sidebar panel
• Show a preview of the selected image
• Change the "replace" button styling into link styling and simplify the label
• Right align the "remove" link and simplify the label

[Soean]

@melchoyce If we change this UI, we should also change it for the featured image. Maybe we should also add a drag&drop area?
We should include the A11y team in this discussion, so I added the label.

Current Video Settings

Current Featured Image settings

[afercia]

We've discussed a bit this issue during today's accessibility bug scrub but haven't came to a conclusion. We'll look a bit better next week, thanks 🙂

[afercia]

Discussed during today's accessibility bug scrub and we'd recommend a consistent pattern with the featured image as @Soean pointed out.

Also to consider the position of the buttons: ideally they should be close to each other for the "proximity of controls" principle, see https://core.trac.wordpress.org/ticket/40822

Lastly, preferably use more explicit buttons text to describe what the buttons do.

The buttons should probably also be updated to "Replace Poster Image" and "Remove Poster Image"

[melchoyce]

Let's go with the existing pattern, and consider exploring a redesign of the pattern at a future time.

[Soean]

We go with the existing pattern, so I am closing this issue.