Background image control: Remove duplicated focus ring#80671
Conversation
The image tools panel button already receives a focus style from the Button component, so the custom inset box-shadow rendered a second, overlapping focus ring. Co-Authored-By: Claude <noreply@anthropic.com>
|
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 If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
|
Size Change: -13 B (0%) Total Size: 7.75 MB 📦 View Changed
|
|
Tested! Confirms the fix works as expected. Focusing the Image button in the Background panel now shows only a single focus ring, no duplication. Screen.Recording.2026-07-24.at.2.51.55.PM.mov |
|
Flaky tests detected in 8d0ddc9. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/30078050398
|
The image tools panel button already receives a focus style from the Button component, so the custom inset box-shadow rendered a second, overlapping focus ring. Co-authored-by: t-hamano <wildworks@git.wordpress.org> Co-authored-by: tyxla <tyxla@git.wordpress.org>
|
I just cherry-picked this PR to the wp/7.1 branch to get it included in the next release: 7a561a8 |
What?
Part of #80138
Removes the custom
box-shadowfocus outline from the Image button in the Background panel.Why?
The
Buttoncomponent now renders its focus ring withoutline, so the component's own focus ring and this custombox-shadoware both drawn, resulting in a double focus ring.Testing Instructions
Screenshots or screencast
Note that to compare the focus outline with other buttons, I am applying a focus state to the relevant buttons using the browser developer tools.
Use of AI Tools
Claude Code was used to create the commit and draft this pull request description. The code change itself was authored and verified manually.