Download the PHP package heimrichhannot/contao-buttermenu-bundle without Composer
On this page you can find all versions of the php package heimrichhannot/contao-buttermenu-bundle. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
Download heimrichhannot/contao-buttermenu-bundle
More information about heimrichhannot/contao-buttermenu-bundle
Files in heimrichhannot/contao-buttermenu-bundle
Package contao-buttermenu-bundle
Short Description A smooth animated navigation menu for contao with hover dropdown (big screens for instance) and off-canvas (mobile for instance) modes.
License LGPL-3.0-or-later
Homepage https://github.com/heimrichhannot/contao-buttermenu-bundle
Informations about the package contao-buttermenu-bundle
Butter menu
A smooth animated navigation menu for contao with hover dropdown (big screens for instance) and off-canvas (mobile for instance) modes.
Technical Instructions
- Attach the butter menu to your
navigation
front end module by using thenav_buttermenu_default
template. - Enable
contao-buttermenu-bundle
asactive entry
at thepage setting
(Encore Fieldset) - Add
@import "~contao-buttermenu/scss/_buttermenu";
to your project scss file and adjust variables before if required
Styling
By default no styles are generated, set $bm-menu-generate-classes
to true
to style butter menu with defaults, otherwise use the provided mixins as stated below.
Required mixins for the default mode (include inside your media queries):
Required mixins for the compact off-canvas mode (include this inside your media queries):
Using the compact off-canvas mode
If you have data-bm-compact-mode
set to off-canvas
on your nav_buttermenu_default
template, you will need an canvas wrapper and for sure an burger menu.
The example below shows how it can work:
We recommend using animated Hamburger icons from Jonathan Suh. The is-active
will be added automatically upon off-canvas menu is opened.
Settings
Attribute | Scope | Default | Description |
---|---|---|---|
data-bm-parent-muted | bm-menu | touch |
Change to click , touch or both to prevent click on parent dropdown links |
data-bm-min-left | bm-menu | 15 | Minimum offset to left side of viewport. |
data-bm-min-right | bm-menu | 15 | Minimum offset to left side of viewport. |
data-bm-columns | bm-menu | 2 | Column count. Limit height for ul > li inside dropdowns to provide flexbox column support with proper height calculation. |
data-bm-column-min | bm-menu | 5 | Activate columns from data-bm-columns only if more than provided list item count. |
data-bm-compact-breakpoint | bm-menu | 768 | The viewport breakpoint width below buttermenu will work in mobile compact mode. |
data-bm-arrow-alignment | bm-menu | center | Change to left, right or center to align arrow with navigation text. |
data-bm-compact-mode | bm-menu | off-canvas | Change to default for normal hover/touch dropdown-toggle, or to off-canvas for an mobile menu with burger menu. |
data-bm-compact-canvas | bm-menu | null | Declare the css-selector for the canvas container e.g. .bm-compact-canvas |
data-bm-compact-toggle | any off-canvas open/close trigger | null | Declare the off-canvas container css selector e.g. .bm-compact-canvas on any open/close trigger like the burger menu button. |
data-bm-compact-show-current | bm-menu | false | If tru, upon open buttermenu in compact mode current active submenu is active (set to false for proper accessibility support) |
All versions of contao-buttermenu-bundle with dependencies
contao/core-bundle Version ^4.9
heimrichhannot/contao-encore-contracts Version ^1.0
symfony/config Version ^4.4 || ^5.4
symfony/http-kernel Version ^4.4 || ^5.4