Megamenu
The Megamenu component provides a reusable pattern for megamenu in the interface.
No component examples available.
API
| Parameter | Default | Type | Description |
|---|---|---|---|
|
menuItems
|
[] | array | - |
|
parentType
|
default | string | - |
|
parentStyle
|
false | string|boolean | - |
|
parentStyleColor
|
primary | string | - |
|
childType
|
default | string | - |
|
childStyle
|
false | string|boolean | - |
|
childStyleColor
|
primary | string | - |
|
mobile
|
false | boolean | - |
CSS API
| Variable | Default | Type | Values | Description |
|---|---|---|---|---|
|
--c-megamenu--base
|
var(--base) | range | - | Main unit that drives radius and spacing scales. |
|
--c-megamenu--color--primary
|
var(--color--primary) | color | - | Primary |
|
--c-megamenu--color--secondary
|
var(--color--secondary) | color | - | Secondary |
|
--c-megamenu--color--surface
|
var(--color--surface) | color | - | Surface |
|
--c-megamenu--font-family-base
|
var(--font-family-base) | font | - | Body Font |
|
--c-megamenu--font-family-heading
|
var(--font-family-heading) | font | - | Falls back to body font if not set. |
|
--c-megamenu--font-size-300
|
var(--font-size-300) | range | - | Two steps above base in the type scale. Equivalent to h5. |
|
--c-megamenu--color--secondary-contrast
|
var(--color--secondary-contrast) | color | - | Secondary Contrast |
|
--c-megamenu--color--primary-contrast
|
var(--color--primary-contrast) | color | - | Primary Contrast |