RackHD/on-web-ui

<div class="content-container offset-header">
  <!--Secondary nav bar-->
  <clr-vertical-nav style="background: #ddd;" [clrVerticalNavCollapsible]="true">
    <a clrVerticalNavLink routerLink="./catalogs" routerLinkActive="active">
      <clr-icon clrVerticalNavIcon shape="view-list"></clr-icon>
      Catalogs
    </a>
    <a clrVerticalNavLink routerLink="./configs" routerLinkActive="active">
      <clr-icon clrVerticalNavIcon shape="file-settings"></clr-icon>
      Configurations
    </a>
    <a clrVerticalNavLink routerLink="./files" routerLinkActive="active">
      <clr-icon clrVerticalNavIcon shape="file"></clr-icon>
      Files
    </a>
    <a clrVerticalNavLink routerLink="./nodes" routerLinkActive="active">
      <clr-icon clrVerticalNavIcon shape="devices"></clr-icon>
      Nodes
    </a>
    <a clrVerticalNavLink routerLink="./obms" routerLinkActive="active">
      <clr-icon clrVerticalNavIcon shape="certificate"></clr-icon>
      OBMs
    </a>
    <a clrVerticalNavLink routerLink="./pollers" routerLinkActive="active">
      <clr-icon clrVerticalNavIcon shape="sync"></clr-icon>
      Pollers
    </a>
    <a clrVerticalNavLink routerLink="./profiles" routerLinkActive="active">
      <clr-icon clrVerticalNavIcon shape="vmw-app"></clr-icon>
      Profiles
    </a>
    <a clrVerticalNavLink routerLink="./skus" routerLinkActive="active">
      <clr-icon clrVerticalNavIcon shape="application"></clr-icon>
      SKUs
    </a>
    <a clrVerticalNavLink routerLink="./templates" routerLinkActive="active">
      <clr-icon clrVerticalNavIcon shape="list"></clr-icon>
      Templates
    </a>
    <a clrVerticalNavLink routerLink="./workflows" routerLinkActive="active">
      <clr-icon clrVerticalNavIcon shape="vm"></clr-icon>
      Workflows
    </a>
  </clr-vertical-nav>
  <div class="content-area">
    <router-outlet></router-outlet>
  </div>
</div>