WordPress.org

Make WordPress Core

Opened 7 weeks ago

Closed 2 weeks ago

Last modified 28 hours ago

#49613 closed defect (bug) (fixed)

Twenty Nineteen: Editor style interferes with navigation menu.

Reported by: Joen Owned by: ianbelanger
Milestone: 5.5 Priority: normal
Severity: normal Version:
Component: Bundled Theme Keywords: good-first-bug has-patch
Focuses: css Cc:

Description

This issue is only present in the latest master version of the Gutenberg plugin.

The following rule is present in the TwentyNineteen editor style:

.wp-block .wp-block {
	width: 100%;
}

This rule was created, if I recall correctly, to adjust the dimensions of nested blocks, and override another rule that set the width of top level blocks to a complex calc rule.

As of https://github.com/WordPress/gutenberg/pull/20729, however, this rule now unintentionally targets navigation menu items, which should show up horizontally in a flow. Specifically, the width of the .wp-block-navigation-link must be auto, or it won't work.

Suggest refactoring the rule above to only target top level blocks in different manner, or use the same rule but apply width: initial; instead, if possible.

Attachments (3)

how it should be.png (21.4 KB) - added by Joen 7 weeks ago.
How it should look
how it is.png (22.8 KB) - added by Joen 7 weeks ago.
How it is
49613.diff (851 bytes) - added by kjellr 5 weeks ago.

Download all attachments as: .zip

Change History (15)

@Joen
7 weeks ago

How it should look

@Joen
7 weeks ago

How it is

#1 @ianbelanger
7 weeks ago

  • Focuses css added
  • Milestone changed from Awaiting Review to Future Release
  • Summary changed from TwentyNineteen: Editor style interferes with navigation menu. to Twenty Nineteen: Editor style interferes with navigation menu.
  • Version trunk deleted

Thanks for reporting this @Joen. Do you know when this is planning to be merged into core? Just so we can be ready for it when the time comes.

#2 @Joen
7 weeks ago

The change is likely to land in the plugin for next weeks release. But it is extremely unlikely to be an issue in core until version 5.5.

#3 @ianbelanger
7 weeks ago

  • Keywords good-first-bug added
  • Milestone changed from Future Release to 5.5

Great! Thanks for the quick response. I'll mark it for 5.5.

@kjellr
5 weeks ago

#4 @kjellr
5 weeks ago

Thanks, @Joen. 49613.diff changes that rule to initial instead of 100%, and it appears to work fine. Tested with a bunch of Group, Cover, and Columns blocks, and haven't noticed any issues.

Before:

http://cldup.com/UajVjdLKAF.png

After:

http://cldup.com/6GmBoYK35d.png

#5 @Joen
5 weeks ago

That patch looks beautiful to me Kjell, thank you! I also verified that the purpose it initially served — to style only top level blocks but not sublevel blocks — works, insofar as nested blocks still look right. Ship it!

#6 @kjellr
5 weeks ago

  • Keywords has-patch added; needs-patch removed

#7 @ianbelanger
5 weeks ago

  • Owner set to ianbelanger
  • Status changed from new to reviewing

Thanks @kjellr and @Joen, I'll get this reviewed and committed.

#8 @ianbelanger
2 weeks ago

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

In 47587:

Bundled Themes: Twenty Nineteen editor style interferes with navigation menu block.

Update editor styles to prepare for changes coming to the editor in 5.5. Currently the issue is only present when using the latest version of the Gutenberg plugin.

Props kjellr, Joen.
Fixes #49613.

#9 @ianbelanger
2 weeks ago

  • Keywords fixed-major added
  • Milestone changed from 5.5 to 5.4.1
  • Resolution fixed deleted
  • Status changed from closed to reopened

Reopening for backport.

#10 @ianbelanger
2 weeks ago

  • Keywords fixed-major removed
  • Milestone changed from 5.4.1 to 5.5
  • Resolution set to fixed
  • Status changed from reopened to closed

Closing as fixed since this does not need to be backported because the issue will only exist in 5.5 or later versions.

#11 @ianbelanger
2 weeks ago

  • Milestone changed from 5.5 to 5.4.2

#12 @SergeyBiryukov
28 hours ago

  • Milestone changed from 5.4.2 to 5.5
Note: See TracTickets for help on using tickets.