What's new page design issue in core wordpress

[weboccults]

Additional design tools boxes are not equal height. please refer screenshot

wp-admin/about.php

[sabernhardt]

making SVG smaller by removing empty space

[sabernhardt]

The circle image is 40 pixels tall, and the rest are 32. The SVG can match that height without changing the dimensions of the 24-pixel circles within.

[webcommsat]

Thank you @sabernhardt for reviewing this ticket and setting the milestone to 6.0.2 and to @weboccults for highlighting it and their first ticket.

[ironprogrammer]

Thank you for the report, @weboccults! Thanks to @sabernhardt for the fix as well 👍🏻

Test Report

This report validates that the indicated patch addresses the issue. LGTM!

Patch tested: https://core.trac.wordpress.org/attachment/ticket/56210/56210.diff

Steps to Reproduce

1. Navigate to /wp-admin/about.php and scroll to the "Additional Design Tools" section.
2. 🐞 Observe the vertical misalignment of the 3rd column of text (Figure 1).

Expected Results

After applying the patch:

• ✅ The vertical alignment of the 3rd column of text is corrected.

Environment

• OS: macOS 12.5
• Browser: Safari 15.6
• Server: nginx/1.23.1
• PHP: 7.4.30
• WordPress: 6.0.2-alpha-53697-src

Actual Results

• ✅ Issue resolved with patch (Figure 2).

Supplemental Artifacts

Figure 1: Before patch (refer to horizontal reference line and vertical text alignment)

Figure 2: After patch

[marybaum]

In an ideal world I would change Additional Desigh Tools to More Design Tools, but this needs to commit today for tomorrow’s RC, so I can live with it for now.

The copy blocks are balanced and aligned, so we’re good to go!

[marybaum]

Props @webcommsat @oglekler for moving this ticket along at today’s component scrub!

[SergeyBiryukov]

In 53924:

Help/About: Improve vertical alignment in the Additional Design Tools section.

This makes a transparent circle SVG smaller by removing empty space to match the height of other images in the same section, so that all three columns are aligned correctly.

Follow-up to [53339].

Props sabernhardt, weboccults, ironprogrammer, webcommsat, marybaum, oglekler.
Fixes #56210.

[SergeyBiryukov]

In 53925:

Help/About: Improve vertical alignment in the Additional Design Tools section.

This makes a transparent circle SVG smaller by removing empty space to match the height of other images in the same section, so that all three columns are aligned correctly.

Follow-up to [53339].

Props sabernhardt, weboccults, ironprogrammer, webcommsat, marybaum, oglekler.
Merges [53924] to the 6.0 branch.
Fixes #56210.