Update menu--header molecule to include website features
https://rbgreenwich.gitlab.io/design_system/?path=/story/molecules-menu--header
-
update icons to use CSS not pattern using the icons scss helpers -
add in divider lines into component config in scss -
add divider line option into wingsuit.yml config -
add in support for 'featured' or 'primary' items eg items that can be a specific color / or maybe pass an option to just set the color for all the links?
Header variant of the menu component
The menu component has a few variants but they all accept the same content.
- title
- url
NB the menu--horizontal component is currently integrated and working in drupal.
For the header variant it accepts title, url and target.
this target is used when the menu is embedded in the #9 component in order to open and close the div which contains the content that is associated with this menu item.
We will need to add an item to be set to a color
menu:
use: '@molecules/menu/menu.twig'
label: Menu
description: Example description
fields:
menu_name:
type: textfield
label: Menu name
items:
type: object
label: Items
variants:
horizontal:
label: Horizontal menu
description: a horizontal menu
fields:
menu_name: Social media
items:
- title: Our services
url: ''
- title: News
url: ''
- title: Events
url: ''
- title: Search
url: ''
header:
label: Header
description: The header menu.
preview:
fields:
menu_name: Social media
items:
- title: Our services
url: ''
target: services
- title: News
url: ''
- title: Events
url: ''
- title: Search
url: ''
target: search
Edited by Han