Number in "Add Themes" screen is misaligned and touches the border

[sukhendu2002]

On the "Add Themes" screen in mobile view, the theme number displayed in the tab header is visually misaligned and touches the top border.

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

This PR fixes the UI issue where the theme count in the "Add Themes" screen touches the border in mobile view.

[diliphingarajiya]

I’ve updated the previous patch by adding a margin to the .filter-count instead of applying padding to the parent div. This ensures better spacing control while maintaining the parent div's original structure and dimensions.

[dilipbheda]

Test Report

Description

This report validates whether the indicated patch works as expected.

Patch tested: https://core.trac.wordpress.org/attachment/ticket/62499/62499.2.patch

Environment

• WordPress: 6.8-alpha-59274-src
• PHP: 8.2.25
• Server: nginx/1.27.2
• Database: mysqli (Server: 8.0.40 / Client: mysqlnd 8.2.25)
• Browser: Chrome 130.0.0.0
• OS: Linux
• Theme: Twenty Twenty-Five 1.0
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.2.0

Actual Results

1. ✅ Issue resolved with patch.

Additional Notes

• I tested both patches, and it seems that 62499.2.patch works well for me.

[ankitkumarshah]

Test Report

Description

This report validates whether the indicated patch works as expected.

Patch tested: https://core.trac.wordpress.org/attachment/ticket/62499/62499.2.patch

Environment

• WordPress: 6.8-alpha-59422
• PHP: 8.2.25
• Server: Apache/2.4.62 (Debian)
• Database: mysqli (Server: 11.4.4-MariaDB-ubu2404 / Client: mysqlnd 8.2.25)
• Browser: Chrome 131.0.0.0
• OS: macOS
• Theme: Twenty Twenty-Five

Actual Results

1. ✅ Issue resolved with patch.

Supplemental Artifacts

[dhruvang21]

Test Report

Description

This report validates that the indicated patch works as expected.

Patch tested: https://core.trac.wordpress.org/attachment/ticket/62499/62499.2.patch

Environment

• WordPress: 6.8-alpha-59274-src
• PHP: 8.2.22
• Server: nginx/1.27.0
• Database: mysqli (Server: 8.0.39 / Client: mysqlnd 8.2.22)
• Browser: Chrome 128.0.0.0 (Mobile)
• OS: Android
• Theme: Twenty Ten 4.3
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.2.0

Actual Results

1. ✅ Issue resolved with patch.

Supplemental Artifacts

Added as Attachment

[sabernhardt]

I found the misalignment in English as early as 6.1, likely related to adding the Block Themes filter link (#56283). In French, the number could touch the border in 6.0.

[im3dabasia1]

Test Report

Description

This report validates whether the indicated patch works as expected.
Patch tested:  https://core.trac.wordpress.org/attachment/ticket/62499/62499.2.patch

Environment

WordPress: 6.8-alpha-59274-src
PHP: 8.2.25
Server: nginx/1.27.2
Database: mysqli (Server: 8.0.40 / Client: mysqlnd 8.2.25)
Browser: Chrome 131.0.0.0
OS: macOS
Theme: Twenty Twenty-Five

Actual Results

✅ Count is now better positioned. The patch fixes the issue.

Supplemental Artifacts

[rinkalpagdar]

Reproduction Report

Description

This report validates whether the issue can be reproduced.

Environment

• WordPress: 6.8-alpha-59274-src
• PHP: 8.2.25
• Server: nginx/1.27.2
• Database: mysqli (Server: 8.0.40 / Client: mysqlnd 8.2.25)
• Browser: Chrome 131.0.0.0
• OS: macOS
• Theme: Twenty Twenty-Five 1.0
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.2.0

Actual Results

1. Error condition does not occur.

Supplemental Artifacts

[audrasjb]

The PR fixes the issue on my side as well. Self assigning for commit.

[audrasjb]

In 59708:

Themes: Improve theme count behavior in the Add Themes screen.

This changeset fixes an UI issue where the theme count in the "Add Themes" screen touches the top border on small screens.

Props sukhendu2002, diliphingarajiya, dilipbheda, ankitkumarshah, dhruvang21, im3dabasia1.
Fixes #62499.