patternfly
Version:
This reference implementation of PatternFly is based on [Bootstrap v3](http://getbootstrap.com/). Think of PatternFly as a "skinned" version of Bootstrap with additional components and customizations.
67 lines • 2.57 kB
HTML
<nav class="nav-pf-vertical-alt">
<ul class="list-group">
<li class="list-group-item active">
<a href="#">
<span class="fa fa-dashboard" title="Dashboard" data-toggle="tooltip" data-placement="right"></span>
<span class="list-group-item-value">Dashboard</span>
</a>
</li>
<li class="list-group-item">
<a href="#">
<span class="fa fa-file-o" title="My Services" data-toggle="tooltip" data-placement="right"></span>
<span class="list-group-item-value">My Services</span>
<span class="badge">12</span>
</a>
</li>
<li class="list-group-item">
<a href="#">
<span class="fa fa-file-text-o" title="My Requests" data-toggle="tooltip" data-placement="right"></span>
<span class="list-group-item-value">My Requests</span>
<span class="badge">2</span>
</a>
</li>
<li class="list-group-item">
<a href="#">
<span class="fa fa-copy" title="My Items" data-toggle="tooltip" data-placement="right"></span>
<span class="list-group-item-value">My Items</span>
</a>
</li>
<li class="list-group-item list-group-item-separator hidden-sm hidden-md hidden-lg">
<a href="#">
<span class="fa fa-external-link" title="Launch"></span>
<span class="list-group-item-value">Launch</span>
</a>
</li>
<li class="list-group-item hidden-sm hidden-md hidden-lg">
<a href="#">
<span class="pficon pficon-flag" title="Notifications"></span>
<span class="list-group-item-value">Notifications</span>
<span class="badge notifications">2</span>
</a>
</li>
<li class="list-group-item hidden-sm hidden-md hidden-lg">
<a href="#">
<span class="pficon pficon-help" title="Help"></span>
<span class="list-group-item-value">Help</span>
</a>
</li>
<li class="list-group-item hidden-sm hidden-md hidden-lg">
<a href="#">
<span class="fa fa-info-circle" title="About"></span>
<span class="list-group-item-value">About</span>
</a>
</li>
<li class="list-group-item hidden-sm hidden-md hidden-lg">
<a href="#">
<span class="pficon pficon-user" title="Preferences"></span>
<span class="list-group-item-value">Preferences</span>
</a>
</li>
<li class="list-group-item hidden-sm hidden-md hidden-lg">
<a href="#">
<span class="fa fa-sign-out" title="Log Out"></span>
<span class="list-group-item-value">Log Out</span>
</a>
</li>
</ul>
</nav>