SubdomainNavBar overflow fix

[joseph-lozano]

Summary

This PR fixes 2 issues:

1. If the sandwich menu was open on narrow screen sizes, and then the viewport was widened, nav items would be duplicated.
2. If there were too many nav items for the height of the viewport, they would overflow into the CTA actions. ([Accessibility] Improve overflowing of SubdomainNavBar on mobile #405)

Fixes #405

List of notable changes:

The if the Nav menu is open, the background will no longer be scrollable, but the Nav menu will be.

What should reviewers focus on?

Verify that the SubdomainNavBar is working as intended, and there were no unintended side-effect changes.

Steps to test:

1. Go to MobileMenuOpenManyItems in Storybook and verify that it is working as intended.
2. Verify that it is working as intended.
3. Ensure all other stories are unchanged

Supporting resources (related issues, external links, etc):

Contributor checklist:

• All new and existing CI checks pass
• Tests prove that the feature works and covers both happy and unhappy paths
• Any drop in coverage, breaking changes or regressions have been documented above
• New visual snapshots have been generated / updated for any UI changes
• All developer debugging and non-functional logging has been removed
• Related issues have been referenced in the PR description

Reviewer checklist:

• Check that pull request and proposed changes adhere to our contribution guidelines and code of conduct
• Check that tests prove the feature works and covers both happy and unhappy paths
• Check that there aren't other open Pull Requests for the same update/change

Screenshots:

Please try to provide before and after screenshots or videos

Before	After

[changeset-bot]

🦋 Changeset detected

Latest commit: e5fdb21

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 6 packages

Name	Type
@primer/react-brand	Patch
@primer/brand-primitives	Patch
@primer/brand-e2e	Patch
@primer/brand-fonts	Patch
@primer/brand-config	Patch
@primer/brand-storybook	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[github-actions]

🟢 No design token changes found

[github-actions]

🟢 No visual differences found

Our visual comparison tests did not find any differences in the UI.

[rezrah]

@nsolerieu @natalie-iv - FYI due to space constraints, we're proposing to drop the title at the narrowest viewport 👇

It will reappear again at the next larger breakpoint.

Is this cool with y'all? FYI, we also already have an option to use this pattern without the title, even at desktop, so this is building on top of that precedent.

[nsolerieu]

Make sense, shit it 🚀

I think it makes sense considering space/size but we are loosing an important semantic element which my create a bit of confusion... but I don't have a (great) solution to offer.

[rezrah]

LGTM...

In the words of @nsolerieu, shit it 🤣