The Menu section controls the styling of the main navigation, including typography, link colours, dropdown menus, and megamenu appearance.
Main Navigation
| Setting |
Description |
| Direction Arrows with Menu Label |
Show or hide dropdown indicator arrows on menu items with sub-menus. Default: Enabled. |
| Spacing for Nav Menu Items |
Margin settings (top, right, bottom, left) for main navigation items. Also affects search and cart icon positions. |
| Main Navigation Links Typography |
Font family, weight, size, letter spacing, and text transform for main nav link text. |
| Main Navigation Links Line Height |
Line height for nav links. Tip: match this to the logo height to vertically centre the menu with the logo. |
| Main Navigation Link Color |
Normal, Hover, and Active colours for main navigation links. |
Dropdown Menu
| Setting |
Description |
| Background Color for Dropdown |
Background colour of the dropdown sub-menu panels. |
| Dropdown Links Border Bottom |
Border style and colour applied to the bottom of each dropdown link. |
| Dropdown Links Spacing |
Padding inside each dropdown link item. |
| Dropdown Links Hover Background |
Background colour applied to dropdown links on hover. |
| Dropdown Menu Links Typography |
Font settings for dropdown link text. |
| Dropdown Links Color |
Normal, Hover, and Active colours for dropdown links. |
Megamenu
| Setting |
Description |
| Megamenu Background Color |
Background colour for megamenu panels (wide multi-column dropdowns). |
| Megamenu Column Title Typography |
Font settings for column headings within megamenu panels. |
| Megamenu Content Typography |
Font settings for general content text within megamenu panels. |