Make WordPress Core

Opened 5 years ago

Closed 4 years ago

Last modified 4 years ago

#49613 closed defect (bug) (fixed)

Twenty Nineteen: Editor style interferes with navigation menu.

Reported by: joen's profile Joen Owned by: ianbelanger's profile 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 5 years ago.
How it should look
how it is.png (22.8 KB) - added by Joen 5 years ago.
How it is
49613.diff (851 bytes) - added by kjellr 5 years ago.

Download all attachments as: .zip

Change History (15)

@Joen
5 years ago

How it should look

@Joen
5 years ago

How it is

#1 @ianbelanger
5 years 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
5 years 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
5 years 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 years ago

#4 @kjellr
5 years 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 years 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 years ago

  • Keywords has-patch added; needs-patch removed

#7 @ianbelanger
5 years ago

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

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

#8 @ianbelanger
4 years 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
4 years 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
4 years 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
4 years ago

  • Milestone changed from 5.5 to 5.4.2

#12 @SergeyBiryukov
4 years ago

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