canonical / vanilla-framework

From community websites to web applications, this CSS framework will help you achieve a consistent look and feel.

Home Page:https://vanillaframework.io

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Parent background highlights when clicking on child button in navigation dropdown item

carkod opened this issue · comments

Describe the bug

In the navigation dropdown pattern, when there is a button inside as a child, when a user clicks on it (having the p-navigation__dropdown-item as a wrapper, because if applied to the link or button it will change the styling), the parent is highlighted and obtains some kind of :active state.

To Reproduce

Steps to reproduce the behavior:

  1. Go to https://codepen.io/carkod/pen/qBwGbWo
  2. Click on LXD
  3. Click on "Introduction"

Expected behavior

Parent (li) shouldn't be highlighted when clicked on children.

Screenshots

navigation-bug.mov

Having buttons inside navigation dropdowns is not something Vanilla supports right now, so it's not a bug in this sense, but a request to add a support for some new functionality.

But indeed, it is a bit unexpected that p-navigation__dropdown-item has hover and active states even if it's not an interactive element (link) but a div.