On touch devices, reveal the dropdown menu on tap of menu item.

Created on 27 March 2025, 2 months ago

Problem/Motivation

On touch devices it is only possible to navigate to a submenu item by enabling a setting making the caret disclose the submenu when tapped.

This is a usability issue because the caret is a small target that can be overlooked or difficult for a user to tap. The ideal user experience for dropdown menus is for the entire menu item and caret to be the target for revealing the dropdown menu.

Steps to reproduce

Create a menu with at least two levels of navigation and enable the module with its default settings.
Enable the Disclosure Menu with its default settings.
Interact with the mobile menu.

Proposed resolution

Change the behavior of touch devices so that the entire menu item is the target area. When a user taps the target area, the dropdown menu is revealed.

Remaining tasks

❌ Submit merge request.
❌ Test the merge request.
❌ Commit the merge request to the next release.
❌ Bask in the satisfaction of an improved user experience for mobile menus. 😊

User interface changes

None.

API changes

None.

Data model changes

None.

✨ Feature request

Status

Active

Version

2.1

Component

Code

Created by

🇺🇸United States cedewey Denver, CO

Live updates comments and jobs are added and updated live.

Comments & Activities

Issue created by @cedewey
Comment 14 days ago →
🇺🇸United States mortona2k Seattle
I'm using UI Icons Menu to select an icon for the top level link. I used and want this to be the trigger for opening the menu.

Whether the top level links are real links is a big consideration for design/ux/implementation. What we configure in the menu settings vs block config is also a ux issue.

So I don't think we always want the link to be tappable when it's supposed to be a link, but it would be good to have the option.

contrib.social Blog FAQ Discussions

Production build 0.71.5 2024