WordPress / gutenberg

The Block Editor project for WordPress and beyond. Plugin is available from the official repository.
https://wordpress.org/gutenberg/
Other
10.53k stars 4.21k forks source link

Image: Fix caption link wrapping in wide/full alignment #67220

Open himanshupathak95 opened 11 hours ago

himanshupathak95 commented 11 hours ago

Fixes: #67206

What?

Changes the width CSS property of links within wide and full-width image block captions to prevent caption text from splitting across lines.

Why?

Currently, when a caption in a wide or full-width Image Block contains a link, the linked text appears on a separate line from the rest of the caption text. This creates an undesirable visual break in what should be continuous caption text.

This occurs due to the width: 100% CSS property being applied to links within wide/full-width image blocks, forcing them to take up the full width and create a line break.

Testing Instructions

  1. Open the block editor with a block theme (e.g., Twenty Twenty-Five)
  2. Insert an Image Block and add an image
  3. Add a caption like "Photo Credit: Nature is Amazing Photo Collection"
  4. Select "Nature is Amazing Photo Collection" and add a link
  5. Test with Wide Width alignment: Caption should now appear on one line

Screenshots

9 10

github-actions[bot] commented 11 hours ago

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: himanshupathak95 <abcd95@git.wordpress.org>
Co-authored-by: Infinite-Null <ankitkumarshah@git.wordpress.org>
Co-authored-by: jartes <jartes@git.wordpress.org>

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