Replace ancient menubar plugin with something responsive (#487) · Issues · Development / Core

Replace ancient menubar plugin with something responsive

The current menubar jQuery plugin dates back to prehistoric times. There have been some attempts to work around it with styling in Shoreditch and adding a hamburger menu for small screens with the slicknav extension but IMO we need something better for core.

Plan o' action:

Create an extension implementing SmartMenus (thanks @ayduns!) https://github.com/aydun/uk.squiffle.kam
Migrate the QuickSearch extension into core (see https://github.com/civicrm/civicrm-core/pull/13039).
Add CRM.menubar abstraction layer to provide a client-side api for adding/removing menu items, etc.
Fix click-to-open behavior (interaction is a bit confusing because the menubar opens on hover but closes on click)
Adjust icon spacing in the markup
Fix the CMS-specific placement issues (right margin for D7, admin region for Joomla)
Migrate the extension into Core.
Consider bundling the extension into ESR (may not be possible due to core patches required).

The current menubar jQuery plugin dates back to prehistoric times.
There have been some attempts to work around it with styling in Shoreditch and adding a hamburger menu for small screens with the [slicknav extension](https://github.com/aghstrategies/com.aghstrategies.slicknav) but IMO we need something better for core.

Plan o' action:

* [x]  Create an extension implementing SmartMenus (thanks @ayduns!) https://github.com/aydun/uk.squiffle.kam
* [x]  Migrate the [QuickSearch](https://civicrm.org/extensions/quicksearch) extension into core (see https://github.com/civicrm/civicrm-core/pull/13039).
* [x]  Add `CRM.menubar` abstraction layer to provide a client-side api for adding/removing menu items, etc.
* [x]  Fix click-to-open behavior (interaction is a bit confusing because the menubar opens on hover but closes on click)
* [x]  Adjust icon spacing in the markup
* [x]  Fix the CMS-specific placement issues (right margin for D7, admin region for Joomla)
* [x]  Migrate the extension into Core.
* [ ]  Consider bundling the extension into ESR (may not be possible due to core patches required).

Edited May 16, 2019 by colemanw

To upload designs, you'll need to enable LFS. More information