<div flex
     layout="column"
     class="admin-navbar-menu navbar-teams"
     ng-if="navbarTeamsController.getPersonalAccount()">
  <section class="left-sidebar-menu"
           flex
           layout="column" layout-align="start stretch">

    <div class="navbar-section navbar-section-title"
         layout="row">
      <div flex>
        <span>Teams</span>
      </div>
    </div>

    <md-list flex layout="column">
      <md-list-item class="navbar-subsection-item">
        <md-button che-reload-href
                   ng-href="#/team/create"
                   layout-align="left">
          <div class="navbar-item" layout="row" layout-align="start center">
            <i class="fa fa-plus navbar-icon navbar-primary"></i>
            <span>Create Team</span>
          </div>
        </md-button>
      </md-list-item>
      <div flex layout="column"
           class="navbar-teams-list">
        <md-list-item class="navbar-subsection-item"
                      ng-repeat="team in navbarTeamsController.getTeams()">
          <md-button nav-bar-selected flex che-reload-href
                     ng-href="#/team/{{team.qualifiedName}}" layout-align="left"
                     target="_self">
            <div class="navbar-item" layout="row" layout-align="start center">
              <span class="navbar-icon"></span>
              <span title="{{team.qualifiedName}}">{{navbarTeamsController.getTeamDisplayName(team)}}</span>
            </div>
          </md-button>
        </md-list-item>
      </div>
    </md-list>
  </section>
</div>
