Click-through blur effect when gallery images have a caption.

[CruelDrool]

What problem does this address?

When gallery images have a caption there is a blur effect added to the <figure> tag using the pseudo class :before. This effect is not click-through and prevents clicking on the image link. Particularly noticeable with taller the images.

What is your proposed solution?

In packages/block-library/src/gallery/style.scss, line 61, add:

pointer-events: none

Not a huge issue, I just add this to my own CSS styling.

[Rishit30G]

Thanks for sharing the issue,

I was able to reproduce the issue successfully, I think on adding cursor: pointer after pointer-events: none should help us resolve this issue:

pointer-events: none
cursor: pointer

Also I think that the max-height can be decreased and backdrop-filter can be increased for a better result, but that's subjective, so maintainers can share their take on this one 🙇🏻

Before	After
https://github.com/user-attachments/assets/3b9bca6f-63ec-4f9e-9d9c-e3538f2e413a	https://github.com/user-attachments/assets/a42643fa-bb90-497d-8c74-5e3d3cda3c1c

PS: Sorry for the bad screen recording, my laptop's screen recorder wasn't able to show the cursor: pointer behaviour so had to rely on phone for recording 😓