Skip to content

Instantly share code, notes, and snippets.

@cmaggiulli
Created July 22, 2018 22:15
Show Gist options
  • Save cmaggiulli/f61969a416410f0def0e0073d6a52cda to your computer and use it in GitHub Desktop.
Save cmaggiulli/f61969a416410f0def0e0073d6a52cda to your computer and use it in GitHub Desktop.
Liferay navbar using AUI in 6.2
<div class="container-fluid" style="display: table; margin: 0 auto; margin-bottom:0px;">
<aui:nav-bar>
<aui:nav cssClass="remove-margin">
<aui:nav-item label="Label n" selected='true' />
<aui:nav-item dropdown="true" iconCssClass="icon-plus" label="Label n">
<aui:nav-item label="Label n" />
<aui:nav-item label="Label n />
</aui:nav-item>
<aui:nav-item label="Inbound Fax" />
<aui:nav-item dropdown="true" iconCssClass="icon-plus" label="Item 0">
<aui:nav-item label="Label 1" />
<aui:nav-item label="Label 2" />
<aui:nav-item label="Label 3" />
</aui:nav-item>
<aui:nav-item label="Item 1" />
<aui:nav-item label="Item 2" />
<aui:nav-item label="Item 3" />
</aui:nav>
</aui:nav-bar>
</div>
<div style="display: table; margin: 0 auto; padding-top:0px">
<ul class="nav nav-tabs">
<li class="active">
<a href="#">List Item N</a>
</li>
<li>
<a href="#">List Item N</a>
</li>
<li>
<a href="#">List Item N</a>
</li>
<li>
<a href="#">List Item N</a>
</li>
<li>
<a href="#">List Item N</a>
</li>
</ul>
<aui:button-row>
<button class="btn btn-info btn-large">Button N</button>
<button class="btn btn-info btn-large">Button N</button>
<button class="btn btn-info btn-large">Button N</button>
<button class="btn btn-info btn-large">Button N</button>
<button class="btn btn-info btn-large">Button N</button>
</aui:button-row>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment