Media Text: Add border support

[aaronrobertshaw]

Part of: #43241

What?

Adopts border support for Media and Text block.

Why?

• Offers greater design flexibility
• Improves consistency in design tooling with other blocks

How?

• Adopts all the available border block supports

Testing Instructions

• In the site editor, add a Media Text block to a page
• Style via Global Styles and confirm the editor and frontend display correctly
• Override the global styles on the block instance and confirm they display appropriately in the editor and frontend

Screenshots or screencast

Screen.Recording.2024-07-15.at.12.51.34.PM.mp4

[github-actions]

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: aaronrobertshaw <[email protected]>
Co-authored-by: andrewserong <[email protected]>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

[andrewserong]

This is testing well for me in the post and site editors, in global styles, and in overrides at the individual block level 👍

Similar to the discussion in adding the border support to the Gallery block in #63428, I notice that the Media & Text block does not clip the image when we set a heavy border radius:

Since the consensus over in #63428 (comment) was to allow border radius even if the block doesn't clip, I don't think it's an issue here, particularly as padding can be set on this block.

LGTM! 🚀

[aaronrobertshaw]

Since the consensus over in #63428 (comment) was to allow border-radius even if the block doesn't clip, I don't think it's an issue here, particularly as padding can be set on this block.

A possible follow-up could be to explore inheriting border-radius on the inner image but combined with the ability to add padding to the media and text block, I'm not sure how well it would work in practice.

Ultimately, I think refactoring this block to use an inner Image block, is our best bet. It would then allow optional control over the inner image border-radius.

As per the linked consensus, let's lean into greater design freedom and merge this 👍