Fix: Adjust Site URL Styles to Prevent Overflow in Pre-Publish Component

[imrraaj]

What?

This fix stops the URL from overflowing in the panel body in the Pre Publish Panel. URL now wraps around the container.

Why?

Fixes #64730

How?

adding the following styles
word-break: break-word; to .components-site-home

Testing Instructions

1. Checkout the PR in the local WordPress installation
2. Create a New Post
3. Click Publish; the Pre Publish screen should be shown.
4. Notice how the URL is broken into multiple lines if the site URL cannot fit properly.

Screenshots or screencast

Before

Screen.Recording.2024-08-23.at.2.20.43.PM.mov

After

Screen.Recording.2024-08-23.at.6.28.05.PM.mov

[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: imrraaj <imrraaj@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: Mamaduka <mamaduka@git.wordpress.org>
Co-authored-by: vcanales <vcanales@git.wordpress.org>

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

[Mamaduka]

I think we also need to add flex-shrink: 0 to the components-site-icon class to prevent the logo from shrinking based on the domain size.

Before	After

[t-hamano]

LGTM! Thank you for the fix 👍 Edit: I missed the previous comment. Sure, the logo shrinking needs to be fixed.

[imrraaj]

I have added the flex-shrink property. PR is ready for review.