Problem/Motivation

Olivero combines the "Primary menu" and "Secondary menu" regions into a single, responsive component. (Maybe it is more accurate to say that the "Secondary menu" region is nested inside the "Primary menu" region.)

If there are links in the "Secondary menu" region, but not in the "Primary menu" region, then on narrow screens the collapsed component does not respond to a click event.

Steps to reproduce

  1. Install Drupal with the minimal profile.
  2. Log in as admin.
  3. Enable Olivero and set it as the default theme.
  4. View any front-end page in a narrow window.
  5. Try to open the secondary menu (account menu).

Proposed resolution

Remaining tasks

User interface changes

API changes

None

Data model changes

None

Release notes snippet

N/A

CommentFileSizeAuthor
#11 1024 view - without patch.png227.26 KBsdhruvi5142
#11 Ipad view - without patch.png77.94 KBsdhruvi5142
#11 Mobile View - without patch.png65.85 KBsdhruvi5142
#11 1024 view - with patch.png419.22 KBsdhruvi5142
#11 Ipad View - with patch.png173.4 KBsdhruvi5142
#11 Mobile View - with patch.png186.4 KBsdhruvi5142
#8 screen-capture-119.mp41.24 MBshweta__sharma
#5 3355510 after Patch.png29.94 KBHarish1688
#5 3355510 before Patch.png44 KBHarish1688
#4 3355510-4.patch1.83 KBgauravvvv

Issue fork drupal-3355510

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

benjifisher created an issue. See original summary.

Version: 10.1.x-dev » 11.x-dev

Drupal core is moving towards using a “main” branch. As an interim step, a new 11.x branch has been opened, as Drupal.org infrastructure cannot currently fully support a branch named main. New developments and disruptive changes should now be targeted for the 11.x branch, which currently accepts only minor-version allowed changes. For more information, see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

mukeysh’s picture

mukeysh commented

The reason for this problem is that the primary-navigation library is only attached to the main menu template, causing the issue. And if there is no link in the main menu then the main menu block is not rendered because of this library is not attached. I think we need to attach library globally to fix this issue.

gauravvvv’s picture

gauravvvv commented
Status: Active » Needs review
StatusFileSize
new 3355510-4.patch1.83 KB

I have removed the navigation-primary library and added all the required files to global-styling. As when we were loading the navigation-primary library only on primary menu, when it is not there it was causing the issue. I have attached the patch for same. please review

Harish1688’s picture

Harish1688 commented
StatusFileSize
new 3355510 before Patch.png44 KB
new 3355510 after Patch.png29.94 KB

Hi,

Tested the patch '3355510-4.patch' locally, and it applied successfully, resolving the issue and addressing the following point:

1. When the "Primary menu" is empty on a narrow window, the 'secondary menu' becomes visible upon clicking the menu.

Looks for RTBC

smustgrave’s picture

smustgrave commented
Status: Needs review » Needs work

#4 had test failures.

rupeshghar’s picture

rupeshghar commented
Assigned: Unassigned » rupeshghar
shweta__sharma’s picture

shweta__sharma commented
Status: Needs work » Needs review
StatusFileSize
new screen-capture-119.mp41.24 MB

I do not see any issue in the expanding menu block everything looks fine.

See screen-recording - screen-capture-119.mp4

Testing steps:-

  1. Latest Drupal 11
  2. Primary menu is empty
  3. Switch on below 1200px screen
  4. Click on hamburger menu
  5. Secondary menu is expanding
sdhruvi5142’s picture

sdhruvi5142 commented
Assigned: rupeshghar » sdhruvi5142

rupeshghar opened merge request !6314

sdhruvi5142’s picture

sdhruvi5142 commented
Status: Needs review » Reviewed & tested by the community
StatusFileSize
new Mobile View - with patch.png186.4 KB
new Ipad View - with patch.png173.4 KB
new 1024 view - with patch.png419.22 KB
new Mobile View - without patch.png65.85 KB
new Ipad view - without patch.png77.94 KB
new 1024 view - without patch.png227.26 KB

Hi, I've verified and tested this issue on drupal latest version 11.x-dev with applied patch #4 and without applied patch in both scenarios, it is working as expected and found no issue.

Followed below testing steps:
1. Install the Drupal 11.x version
2. Install/Enable the Olivero Theme
3. Now went to Primary menu and secondary menu on narrow screens (Mobile, Ipad and 1024(Laptop))
4. And it is working as expected

Testing Results:
In Narrow screens also the secondary menu was getting expanded and working as expected.
Attaching screenshots for reference
Hence moving to RTBC
Thanks

shweta__sharma’s picture

shweta__sharma commented
Assigned: sdhruvi5142 » Unassigned
shweta__sharma’s picture

shweta__sharma commented
Status: Reviewed & tested by the community » Closed (cannot reproduce)

Based on #8 and #11 testing moving to status to closed (cannot reproduce)
Thanks