Make WordPress Core

Opened 21 months ago

Closed 21 months ago

Last modified 14 months ago

#56474 closed defect (bug) (fixed)

Twenty Twenty: Fix social icons margin in widget area

Reported by: grandeljay's profile grandeljay Owned by: audrasjb's profile audrasjb
Milestone: 6.1 Priority: normal
Severity: normal Version: 5.9
Component: Bundled Theme Keywords: has-patch has-screenshots commit
Focuses: css Cc:

Description


Attachments (5)

56474.diff (1.1 KB) - added by sabernhardt 21 months ago.
removes the top margin from social icons in widgets
social-widget-before.png (107.7 KB) - added by sabernhardt 21 months ago.
Social Icons block and other list widgets before the patch
social-widget-with-patch.png (100.8 KB) - added by sabernhardt 21 months ago.
Same widgets with 56474.diff
Capture d’écran 2022-09-14 à 23.24.07.png (149.2 KB) - added by audrasjb 21 months ago.
Before patch
Capture d’écran 2022-09-14 à 23.25.18.png (154.1 KB) - added by audrasjb 21 months ago.
After patch

Download all attachments as: .zip

Change History (14)

This ticket was mentioned in PR #3159 on WordPress/wordpress-develop by grandeljay.


21 months ago
#1

This is supposed to fix the margin on the social icons in the footer widget for Twenty Twenty

https://i0.wp.com/user-images.githubusercontent.com/45571053/187665894-15229f80-0676-4179-9715-4132daa8850a.png

Trac ticket: https://core.trac.wordpress.org/ticket/56474

This ticket was mentioned in PR #3159 on WordPress/wordpress-develop by grandeljay.


21 months ago
#2

This is supposed to fix the margin on the social icons in the footer widget for Twenty Twenty

https://i0.wp.com/user-images.githubusercontent.com/45571053/187665894-15229f80-0676-4179-9715-4132daa8850a.png

Trac ticket: https://core.trac.wordpress.org/ticket/56474

#3 @sabernhardt
21 months ago

  • Component changed from Themes to Bundled Theme
  • Focuses css added
  • Milestone changed from Awaiting Review to 6.1
  • Severity changed from trivial to normal
  • Summary changed from Twenty Twenty: Fix social icons margin to Twenty Twenty: Fix social icons margin in widget area
  • Version trunk deleted

Thanks for the report and the patch!

If someone has customized the margin for li elements in other widget blocks, adding :not() to the theme's .widget li selector would override their custom margin.

Adding something like this in a new "Widget: Blocks" sub-section (perhaps following "Widget: Text" under "Widgets") might be better:

.widget .wp-block-social-links li {
	margin-top: 0;
}

#4 @sabernhardt
21 months ago

  • Version set to 5.9

Before 5.9, the block-library stylesheet set the margins for these icons, and that had higher specificity than .widget li:

.wp-block-social-links .wp-social-link.wp-social-link.wp-social-link {
  margin: 4px 8px 4px 0;
}

#5 @grandeljay
21 months ago

Thanks!

I've changed the selector to .widget .wp-block-social-links li now and it seems to display properly.

Last edited 21 months ago by grandeljay (previous) (diff)

@sabernhardt
21 months ago

removes the top margin from social icons in widgets

@sabernhardt
21 months ago

Social Icons block and other list widgets before the patch

@sabernhardt
21 months ago

Same widgets with 56474.diff

#6 @sabernhardt
21 months ago

The top margin on .widget li was in the theme early (and increased before the theme became available), so I think that needs to stay.

56474.diff removes the top margin from social icons in a widget area, without affecting other list widgets.

#7 @audrasjb
21 months ago

  • Keywords has-screenshots commit added
  • Owner set to audrasjb
  • Status changed from new to accepted

Thanks for the patch and for testing so much use cases @sabernhardt!

I added my own test results and it works fine. Self assigning for commit.

#8 @audrasjb
21 months ago

  • Resolution set to fixed
  • Status changed from accepted to closed

In 54167:

Twenty Twenty: Fix Social Links widget alignment.

This fixes an alignment issue with the Social Links block used in the context of a widget area.

Props grandeljay, sabernhardt.
Fixes #56474.

This ticket was mentioned in Slack in #core by sabernhardt. View the logs.


14 months ago

Note: See TracTickets for help on using tickets.