Hovered/focused nav items won't change their background colors

[luhaopeng]

Expected Behavior

NavItems on hover/focus have light background color.

Current Behavior

NavItems never change their background colors.

Failure Information (for bugs)

Problem might locate here. :hover and :focus states are embedded inside .nav-item.active .nav-link instead of .nav-item .nav-link.

Steps to Reproduce

Please provide detailed steps for reproducing the issue.

1. Open the official website for material-dashboard.
2. Choose an arbitrary navbar.
3. Hover between the nav items and you'll find the background colors won't change at all.

Context

• Version: 2.1.1
• Device: PC
• Operating System: Windows
• Browser and Version: Chrome 73

Possible solution

Move the &:hover, &:focus {...} outside .nav-item.active .nav-link.