Nav Link

These are links specifically defined within the Nav component


Standard Nav Link

Nav Link 1

Nav Link with Icon

Nav Link 2 with icon

Nav Link with Child Nav Links

Nav Link 3

Sage Component

SageNavLink
Property Description Type Default

active

Manually set an item to be styled as the selected item.

Boolean

false

icon

Allows for configurations for an and its placement to be provided.

String

null

items

Provides a list of sub-items (nested list) to dispaly with this root NavLink.

Array of items with the same structure as NavLinks

nil

link

This sets the href for the link.

String

null

method

Allows for configuration for custom link methods

String

nil

no_active

When enabled, this will remove the active link styles for the current page's link.

String

nil

text

The text for the link.

String

nil

type

Setting the link to sub creates a submenu link.

String: [ sub ]

nil

Do
  • In addition to setting the type: 'sub', be sure to wrap the sub menus with a class of .sage-nav__list.sage-nav__list--sub.