Clay CSS v3.9.0

Nav

Base Nav

Bootstrap 4's Navigations share general markup and styles from the base .nav class, therefore the components Nav Pills, Nav Tabs, Nav Underline, Menubar, Navbar, Application Bar, Management Bar, and Navigation Bar all use .nav as its base.
.nav-link and .active.nav-link in the Base Nav doesn't have any special styling to make it easier to overwrite via color modifiers used in Clay's components above. If you would like to use a custom color scheme for the Base Nav, create a custom color modifier class and use the clay-nav-variant($map) mixin.

Add class nav-nested to the outermost nav to use padding to indent each nested nav.

Also collapsible when used with Bootstrap Collapse Plugin.

nav-nested-margins uses margins instead of padding to indent.

Add nav-unstyled to your nav to remove spacing around nav-link and nav-btn.

How to use nav helper classes

Dropdown toggle with anchor: dropdown-toggle nav-link

Dropdown toggle with button: btn btn-unstyled dropdown-toggle nav-link

An anchor in Nav Item styled like btn: btn btn-primary nav-btn nav-btn-monospaced

A button in Nav Item styled like nav-link: btn btn-unstyled nav-link

A button in Nav Item: btn btn-primary nav-btn

A monospaced anchor in Nav Item: nav-link nav-link-monospaced

A monospaced button in Nav Item: btn btn-primary nav-btn nav-btn-monospaced