Skip to content

[Content Types]: Fix extra Page padding causing vertical scrollbar#78661

Open
yogeshbhutkar wants to merge 2 commits into
WordPress:trunkfrom
yogeshbhutkar:fix/content-types-vertical-scrollbar
Open

[Content Types]: Fix extra Page padding causing vertical scrollbar#78661
yogeshbhutkar wants to merge 2 commits into
WordPress:trunkfrom
yogeshbhutkar:fix/content-types-vertical-scrollbar

Conversation

@yogeshbhutkar
Copy link
Copy Markdown
Contributor

What, Why, and How?

Related to #77600

While testing the Content Types, I noticed that the dashboard displayed an unnecessary vertical scrollbar. The issue was caused by padding applied directly to the Page component, which increased the page height enough to trigger scrolling.

This PR removes that padding from Page and applies it to the Tab's wrapper instead, matching how it is used elsewhere and fixing the extra scrollbar. Please feel free to close this PR if this is already being handled elsewhere.

Ref:

.routes-template-list__tabs-wrapper {
border-bottom: 1px solid $gray-100;
padding: 0 $grid-unit-30;
}

Testing Instructions

  1. Enable the "Content Types" Experiment.
  2. Navigate to Settings → Content Types.
  3. Verify that the unnecessary vertical scrollbar does not appear.

Screenshots or screencast

Before After
bug-before after(2)

Use of AI Tools

None

@yogeshbhutkar yogeshbhutkar self-assigned this May 26, 2026
@yogeshbhutkar yogeshbhutkar added [Type] Bug An existing feature does not function as intended [Type] Experimental Experimental feature or API. Content types (experimental) Affects the content types experiment and removed [Type] Experimental Experimental feature or API. labels May 26, 2026
@WordPress WordPress deleted a comment from github-actions Bot May 26, 2026
@yogeshbhutkar yogeshbhutkar force-pushed the fix/content-types-vertical-scrollbar branch from ac48fd2 to 29a1a80 Compare May 26, 2026 08:57
@yogeshbhutkar yogeshbhutkar requested a review from Copilot May 26, 2026 09:04
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR addresses an unnecessary vertical scrollbar in the experimental Content Types admin screen by removing padding from the top-level Page container and applying spacing to the tabs header wrapper instead, aligning the layout with similar admin patterns (e.g., template list tabs wrapper).

Changes:

  • Removed .content-types-page padding to avoid increasing the overall page height.
  • Added horizontal and top padding to .content-types-tabs-wrapper while keeping the existing bottom border.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

@yogeshbhutkar yogeshbhutkar requested a review from ntsekouras May 26, 2026 09:22
@yogeshbhutkar yogeshbhutkar marked this pull request as ready for review May 26, 2026 09:22
@github-actions
Copy link
Copy Markdown

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 props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: yogeshbhutkar <yogeshbhutkar@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@im3dabasia
Copy link
Copy Markdown
Contributor

im3dabasia commented May 26, 2026

Thanks for the PR, @yogeshbhutkar.

I observed the same pattern on two other screens, the Connectors screen and the Gutenberg Experiments screen, where the top-level header has 24px left/right padding and 16px top/bottom padding applied. For consistency, we should match that here as well.

That said, this PR is already a solid improvement, and aligning it with the other similar screens would make the experience even more consistent overall.

Attaching some screenshots

This PR

Screenshot 2026-05-26 at 5 32 14 PM

Connectors

Screenshot 2026-05-26 at 5 31 29 PM

Experiments

Screenshot 2026-05-26 at 5 30 45 PM

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Content types (experimental) Affects the content types experiment [Type] Bug An existing feature does not function as intended

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants