Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(MegaMenu): prevent menu items from overlapping #3565

Merged

Conversation

annawen1
Copy link
Member

Related Ticket(s)

Masthead / mega menu – content overlapping #3519

Description

Menu Items were overlapping at certain breakpoint. Add utility to calculate total width of the masthead and set the media query to hide and show elements.

Aug-13-2020 00-08-28

Changelog

New

  • calculateTotalWidth utility to find total width of elements passed in.
  • use the total width calculated to set the media query by creating a style tag within the <head> element to hide/show items

@annawen1 annawen1 added package: react Work necessary for the Carbon for IBM.com react components package feature flag labels Aug 13, 2020
@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Aug 13, 2020

@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Aug 13, 2020

@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Aug 13, 2020

@annawen1 annawen1 marked this pull request as draft August 13, 2020 12:19
@annawen1 annawen1 marked this pull request as ready for review August 13, 2020 13:26
Copy link
Member

@kennylam kennylam left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good @annawen1 👍

@jeffchew jeffchew added the Ready to merge Label for the pull requests that are ready to merge label Aug 14, 2020
@kodiakhq kodiakhq bot merged commit 8bd6375 into carbon-design-system:master Aug 14, 2020
@annawen1 annawen1 deleted the fix/masthead-menu-item-overlap branch September 10, 2020 18:02
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feature flag package: react Work necessary for the Carbon for IBM.com react components package Ready to merge Label for the pull requests that are ready to merge
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants