App Navigation

Example: Left Nav


Code

HTML

<ul class="nav nav-pills nav-stacked">
    <li class="active"><a href="#">App Section One</a></li>
    <li><a href="#">App Section Two</a></li>
    <li><a href="#">App Section Three</a></li>
    <li><a href="#">App Section Four</a></li>
    <li><a href="#">App Section Five</a></li>
</ul>
                

Documentation

Problem Being Solved

Apps may contain subsections of similar content.

When To Use

This navigation should be used to group similar content / forms within an app. This makes it easier for a user to discover how to accomplish a specific task (e.g., changing their address within the Profile app).

When Not To use

This pattern should not be used on the enterprise site. It is intended for the standalone Azure apps only.

Formatting

Left nav uses Bootstrap pill classes.