<template><nav class="top-nav"> <ul class="nav"> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.main"><i class="icon-speedometer"></i> DASHBOARD <span class="tag tag-info">NEW</span></a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.main2"><i class="icon-speedometer"></i> DASHBOARD 2 <span class="tag tag-warning">NEW</span></a> </li> <li class="nav-item nav-dropdown" ng-class="{open: $state.includes('app.components')}"> <a class="nav-link nav-dropdown-toggle" ng-class="{active: $state.includes('app.components')}" href="#"><i class="icon-puzzle"></i> Components</a> <ul class="nav-dropdown-items"> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.components.buttons"><i class="icon-puzzle"></i> BUTTONS</a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.components.social-buttons"><i class="icon-puzzle"></i> Social Buttons</a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.components.cards"><i class="icon-puzzle"></i> CARDS</a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.components.forms"><i class="icon-puzzle"></i> FORMS</a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.components.switches"><i class="icon-puzzle"></i> SWITCHES</a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.components.tables"><i class="icon-puzzle"></i> TABLES</a> </li> </ul> </li> <li class="nav-item nav-dropdown" ng-class="{open: $state.includes('app.icons')}"> <a class="nav-link nav-dropdown-toggle" ng-class="{active: $state.includes('app.icons')}" href="#"><i class="icon-star"></i> ICONS</a> <ul class="nav-dropdown-items"> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.icons.fontawesome"><i class="icon-star"></i> Font Awesome</a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.icons.simplelineicons"><i class="icon-star"></i> Simple Line Icons</a> </li> </ul> </li> <li class="nav-item nav-dropdown" ng-class="{open: $state.includes('app.plugins')}"> <a class="nav-link nav-dropdown-toggle" ng-class="{active: $state.includes('app.plugins')}" href="#"><i class="icon-energy"></i> Plugins</a> <ul class="nav-dropdown-items"> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.plugins.calendar"><i class="icon-calendar"></i> CALENDAR</a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.plugins.notifications"><i class="icon-info"></i> NOTIFICATIONS</a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.plugins.sliders"><i class="icon-equalizer"></i> SLIDERS</a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.plugins.tables"><i class="icon-list"></i> TABLES</a> </li> </ul> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.forms"><i class="icon-note"></i> FORMS <span class="tag tag-danger">NEW</span></a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.widgets"><i class="icon-calculator"></i> WIDGETS <span class="tag tag-info">NEW</span></a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.charts"><i class="icon-pie-chart"></i> CHARTS</a> </li> <li class="nav-item nav-dropdown" ng-class="{open: $state.includes('app.pages')}"> <a class="nav-link nav-dropdown-toggle" ng-class="{active: $state.includes('app.pages')}" href="#"><i class="icon-star"></i> PAGES</a> <ul class="nav-dropdown-items"> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="appSimple.login"><i class="icon-star"></i> Login</a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="appSimple.register"><i class="icon-star"></i> Register</a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="appSimple.404"><i class="icon-star"></i> Error 404</a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="appSimple.500"><i class="icon-star"></i> Error 500</a> </li> </ul> </li> <li class="nav-item nav-dropdown" ng-class="{open: $state.includes('app.uikits')}"> <a class="nav-link nav-dropdown-toggle" ng-class="{active: $state.includes('app.uikits')}" ui-sref-active="active" href="#"><i class="icon-layers"></i> UI Kits</a> <ul class="nav-dropdown-items"> <li class="nav-item nav-dropdown" ng-class="{open: $state.includes('app.uikits.invoicing')}"> <a class="nav-link nav-dropdown-toggle" ng-class="{active: $state.includes('app.uikits.invoicing')}" href="#"><i class="icon-speech"></i> INVOICING</a> <ul class="nav-dropdown-items"> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.uikits.invoicing.invoice"><i class="icon-speech"></i> INVOICE</a> </li> </ul> </li> <li class="nav-item nav-dropdown" ng-class="{open: $state.includes('app.uikits.email')}"> <a class="nav-link nav-dropdown-toggle" ng-class="{active: $state.includes('app.uikits.email')}" href="#"><i class="icon-speech"></i> EMAIL</a> <ul class="nav-dropdown-items"> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.uikits.email.inbox"><i class="icon-speech"></i> INBOX</a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.uikits.email.message"><i class="icon-speech"></i> MESSAGE</a> </li> <li class="nav-item"> <a class="nav-link" ui-sref-active="active" ui-sref="app.uikits.email.compose"><i class="icon-speech"></i> COMPOSE</a> </li> </ul> </li> </ul> </li> </ul> </nav> </template>