Make WordPress Core

Opened 23 months ago

Last modified 23 months ago

#56195 new defect (bug)

Padding issue in Post Title Block

Reported by: varshil151189's profile varshil151189 Owned by:
Milestone: Awaiting Review Priority: normal
Severity: normal Version: 6.0
Component: Editor Keywords: has-patch close
Focuses: ui, css Cc:

Description

Hello Team,

In Twenty Twenty Two Theme, when we add Post Title block in editor side and after that applied background color for that, we can see there is some padding but in Frontend side the padding is not reflected.

For more information, please find video below:

Video URL: https://share.cleanshot.com/28JCrp2bbSPC7aT2i2d5

Thank you.

Attachments (1)

56195.patch (511 bytes) - added by varshil151189 23 months ago.

Download all attachments as: .zip

Change History (5)

#1 @varshil151189
23 months ago

  • Keywords has-patch needs-testing added; needs-patch removed

#2 @poena
23 months ago

Hi!
I am able to reproduce this in other themes, I believe it is a problem with the default block styles, not the theme. Let's do some more testing?

I tested with Emptytheme, which does not have any block styles of its own.
I tested with the post title, level H2 (default heading level), using a color from the default WordPress color palette (as opposed to a custom color).

In the editor I see the following CSS:

h1.has-background, h2.has-background, h3.has-background, h4.has-background, h5.has-background, h6.has-background {
    padding: 1.25em 2.375em;
}

But on the front, the .has-background padding styles are not loading.

I tested with WordPress 6.0, with and without Gutenberg, on Chrome, Mac OS.

Last edited 23 months ago by poena (previous) (diff)

#3 @poena
23 months ago

What I am thinking is that, if we fix this in the theme, we will eventually have duplicate styles once the underlying problem is fixed in Gutenberg. It would also only solve it for this single theme, not all the other themes that are affected.

#4 @sabernhardt
23 months ago

  • Component changed from Bundled Theme to Editor
  • Keywords close added; needs-testing removed
  • Summary changed from Twenty Twenty Two: Padding issue in Post Title Block to Padding issue in Post Title Block

Yes, this editor issue belongs on GitHub (if not already there) for any theme.

If you add any heading blocks to the same post, the post title will get the padding on the front end because it is in the wp-block-heading-inline-css styles. Could the post title block use the heading block styles as a sort of dependency?

Version 0, edited 23 months ago by sabernhardt (next)
Note: See TracTickets for help on using tickets.