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(Masthead): have nav item render with selected styles in mobile nav #4259

Merged

Conversation

annawen1
Copy link
Member

Related Ticket(s)

menu item doesn't show active state in hamburg menu in masthead #4076

Description

The LeftNav menu item wasn't checking with the proper prop, so it wasn't detecting whether to render the nav item as selected in mobile.

FIXED:
Screen Shot 2020-10-19 at 4 26 13 PM

Changelog

New

  • add titleEnglish field to the Nulla quis sem at nibh elementum imperdiet custom nav item to allow for additional testing

Changed

  • check for rest.selectedMenuItem in the LeftNav and render #{$prefix}--masthead__l0-nav--selected-item classname - this is specific for L0 nav items that don't have a menu

@annawen1 annawen1 added the package: react Work necessary for the Carbon for IBM.com react components package label Oct 19, 2020
@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Oct 19, 2020

@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Oct 19, 2020

@annawen1 annawen1 changed the title fix(Masthead): have nav item selected in mobile fix(Masthead): have nav item render with selected styles in mobile nav Oct 19, 2020
Copy link
Member

@ariellalgilmore ariellalgilmore left a comment

Choose a reason for hiding this comment

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

LGTM :) thanks @annawen1!

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.

LGTM!

@kennylam kennylam added the Ready to merge Label for the pull requests that are ready to merge label Oct 19, 2020
@kodiakhq kodiakhq bot merged commit de0a34f into carbon-design-system:master Oct 19, 2020
ariellalgilmore pushed a commit to ariellalgilmore/carbon-for-ibm-dotcom that referenced this pull request Oct 22, 2020
carbon-design-system#4259)

### Related Ticket(s)

menu item doesn't show active state in hamburg menu in masthead carbon-design-system#4076

### Description

The `LeftNav` menu item wasn't checking with the proper prop, so it wasn't detecting whether to render the nav item as selected in mobile.

FIXED:
<img width="652" alt="Screen Shot 2020-10-19 at 4 26 13 PM" src="https://user-images.githubusercontent.com/54281166/96508017-fcd87200-1227-11eb-98d1-3b56c314b5a1.png">

### Changelog

**New**

- add `titleEnglish` field to the `Nulla quis sem at nibh elementum imperdiet` custom nav item to allow for additional testing

**Changed**

- check for `rest.selectedMenuItem` in the `LeftNav` and render `#{$prefix}--masthead__l0-nav--selected-item` classname - this is specific for L0 nav items that don't have a menu


<!-- React and Web Component deploy previews are enabled by default. -->
<!-- To enable additional available deploy previews, apply the following -->
<!-- labels for the corresponding package: -->
<!-- *** "package: services": Services -->
<!-- *** "package: utilities": Utilities -->
<!-- *** "package: styles": Carbon Expressive -->
<!-- *** "RTL": React / Web Components (RTL) -->
<!-- *** "feature flag": React / Web Components (experimental) -->
@annawen1 annawen1 deleted the fix/masthead-selected-item branch November 17, 2020 13:01
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
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