Fix: Navigation block width constricted on large viewports #49302
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
MaggieCabrera
requested review from
beafialho,
jasmussen,
scruffian,
jeryj,
getdave,
ajlende and
draganescu
jasmussen
approved these changes
Mar 23, 2023
|
Size Change: +21 B (0%) Total Size: 1.34 MB
ℹ️ View Unchanged
|
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What?
Closes #47652
This PR fixes a problem created after fixing #43576
Why?
Themes with full width navigation blocks would have their menus constricted to a max width of the global wide size, while the original change intended to only do that to the overlay, not the desktop menu as well.
How?
The class
.wp-block-navigation__responsive-closeis wrapping the menu always, not just when it's a "mobile" menu. I wrapped the CSS that was intended only for the overlay inside the.has-modal-openclass so it only applies when it's the modal that we are showingTesting Instructions
I'm using this markup for testing on the Skatepark theme.
Before this PR, the navigation block that is set to full width is not extending as such. After this PR it does.
Check that the fix introduced in #43576 is still applying when we open the overlayed menu.
Screenshots or screencast
Before:
After: