Problem/Motivation

When using the "Second level horizontal" navbar type with hover disabled (click mode), clicking on a first-level dropdown displayed the second level vertically (Bootstrap default) instead of horizontally. The horizontal layout only worked for items in the active trail.

Root cause:

  1. CSS issue: Horizontal styling only targeted .dropdown.active, not .dropdown.show
  2. JS issue: Bootstrap 5 doesn't add .show to the parent .dropdown element when clicked - only to the toggle link and dropdown-menu

Steps to reproduce

  1. Set navbar type to "Second level horizontal"
  2. Set "Navbar show sub-level on hover" to OFF
  3. Navigate to a page where no dropdown is in active trail (e.g., home page)
  4. Click on a dropdown menu item
  5. Actual: Second level displays as vertical dropdown
  6. Expected: Second level displays horizontally

Issue fork bs_base-3571244

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

pivica created an issue. See original summary.

pivica’s picture

pivica commented
Issue summary: View changes

pivica opened merge request !31

  • pivica committed ef96ca71 on 2.0.x 
    feat: #3571244 Fix "Second level horizontal" navbar type to work...
pivica’s picture

pivica commented
Status: Active » Fixed

Merged.

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.