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.
98 lines (97 loc) • 3.25 kB
HTML
{% assign launchergrid = include.launchergrid %}
{% assign launchericons = include.launchericons %}
<nav class="navbar navbar-default navbar-pf" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">
<img src="{{site.assets-base}}/{{site.navbar-brand-icon}}" alt="{{ site.title-product }}" />
</a>
</div>
<div class="collapse navbar-collapse navbar-collapse-1">
<ul class="nav navbar-nav navbar-utility">
{% if page.applauncher %}
{% include widgets/framework/application-launcher.html icons=launchericons grid=launchergrid %}
{% endif %}
<li class="dropdown">
<a href="#0" class="nav-item-iconic" id="horizontalDropdownMenu1{{include.navindex}}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
<span title="Help" class="fa pficon-help"></span>
<span class="caret"></span>
</a>
<ul class="dropdown-menu" aria-labelledby="horizontalDropdownMenu1{{include.navindex}}">
<li><a href="#0">Help</a></li>
<li><a href="#0">About</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#0" class="dropdown-toggle" data-toggle="dropdown">
<span class="pficon pficon-user"></span>
Brian Johnson <b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li>
<a href="#0">Link</a>
</li>
<li>
<a href="#0">Another link</a>
</li>
<li>
<a href="#0">Something else here</a>
</li>
<li class="divider"></li>
<li class="dropdown-submenu">
<a tabindex="-1" href="#0">More options</a>
<ul class="dropdown-menu">
<li>
<a href="#0">Link</a>
</li>
<li>
<a href="#0">Another link</a>
</li>
<li>
<a href="#0">Something else here</a>
</li>
<li class="divider"></li>
<li class="dropdown-header">Nav header</li>
<li>
<a href="#0">Separated link</a>
</li>
<li class="divider"></li>
<li>
<a href="#0">One more separated link</a>
</li>
</ul>
</li>
<li class="divider"></li>
<li>
<a href="#0">One more separated link</a>
</li>
</ul>
</li>
</ul>
<ul class="nav navbar-nav navbar-primary">
<li>
<a href="#0">First Link</a>
</li>
<li class="active">
<a href="#0">Another Link</a>
</li>
<li>
<a href="#0">And Another</a>
</li>
<li>
<a href="#0">As a General Rule</a>
</li>
<li>
<a href="#0">Five to Seven Links</a>
</li>
<li>
<a href="#0">Is Good</a>
</li>
</ul>
</div>
</nav>