Variables

These are all the component specific variables that can be used for customization.

Name Value
@menu-arrow-horizontal \25BE
@menu-arrow-vertical \25B8
@menu-bg transparent
@menu-color @skin-gray-600
@menu-disabled-opacity @opacity-60
@menu-font-letter-spacing 0.09em
@menu-font-size @font-size-medium
@menu-font-weight @font-weight-medium
@menu-height @space-48
@menu-line-height 3rem
@menu-heading-color @skin-black
@menu-heading-font-weight @font-weight-medium
@menu-heading-height @menu-height
@menu-heading-padding @menu-link-padding
@menu-divider-bg-color @skin-border-primary
@menu-divider-margin 0 @space-8
@menu-divider-thickness 1px
@menu-vertical-divider-margin @space-8
@menu-link-active-color @skin-black
@menu-link-color @menu-color
@menu-link-focus-bg-color fade(@skin-primary, 15)
@menu-link-focus-color @skin-primary
@menu-link-height @menu-height
@menu-link-hover-bg-color fade(@skin-primary, 5)
@menu-link-justify-content center
@menu-link-line-height @menu-line-height
@menu-link-padding 0 @space-20
@menu-children-bg-color @skin-background
@menu-children-link-after-padding @space-8
@menu-transition-duration @transition-duration-default
@menu-transition-property background-color
@menu-transition-timing linear