Administration: Fix misaligned spinner in admin screens#11649
Administration: Fix misaligned spinner in admin screens#11649t-hamano wants to merge 3 commits intoWordPress:trunkfrom
Conversation
Adjust the default `.spinner` top margin so it aligns with adjacent buttons, and remove the now-redundant offset on `#publishing-action .spinner`. Add `vertical-align: top` to the spinner inside `#template .submit` so it lines up correctly with the surrounding submit controls. Fixes #65131.
The default `.spinner` top margin was increased to align spinners with adjacent buttons across admin screens, but that offset misaligns the spinner inside Customizer accordion triggers. Override it back to `0` in this context so the spinner remains vertically centered with the trigger label. Follow-up to [previous commit on this branch]. See #65131.
| width: 20px; | ||
| height: 20px; | ||
| margin: 4px 10px 0; | ||
| margin: 10px 10px 0; |
There was a problem hiding this comment.
This change changes the default top margin for all spinners, so we need to be aware. We need to verify in various places that this does not cause unintended shifts.
| .accordion-section-title button.accordion-trigger .spinner { | ||
| margin-top: 0; | ||
| } |
There was a problem hiding this comment.
Without this change, the spinner position in Customizer > Menus > Accordion Title will be misaligned.
|
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 Core Committers: Use this line as a base for the props when committing in SVN: To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
Test using WordPress PlaygroundThe changes in this pull request can previewed and tested using a WordPress Playground instance. WordPress Playground is an experimental project that creates a full WordPress instance entirely within the browser. Some things to be aware of
For more details about these limitations and more, check out the Limitations page in the WordPress Playground documentation. |
|
Spinners Alignment Issue is Resolved ✅ Classic Editor Add / Edit Post:
Classic Widget Editor: Save Button:
Add Tag Button:
Add Menu Item:
Customizer: Add Custom Link Menu Item:
Media: Edit Image button
Media: Update button
Theme File Editor - Update File button
Plugin File Editor - Update File button
|
2 participants
Trac ticket: <!-- insert a link to the WordPress Trac ticket here -->
How to Test
Register the following code as a browser bookmark. This will make it easier to test by visualizing the
.spinnerelement.Screenshots
Classic Editor > Publish Sidebar > Update or Publish button
Classic Widget Editor > Save button
Posts > Tags > Add Tag button
Menus > Add to Menu button
Customize > Menus > Menu > Add Items > Custom Links > Add to Menu
Media (List view) > Edit > Edit Image button
Media (List view) > Edit > Update button
Media (List view) > Attach > Search input field
Theme File Editor > Update File button
Plugin File Editor > Update File button
Use of AI Tools
This Pull Request is for code review only. Please keep all other discussion in the Trac ticket. Do not merge this Pull Request. See GitHub Pull Requests for Code Review in the Core Handbook for more details.