@akveo/nga-theme/components/user/user.component.html

@akveo/nga-theme

<div class="user-container" (click)="toggleMenu()" [ngClass]="{'with-menu' : hasMenu()}">
  <div *ngIf="picture" class="user-picture image" style.background-image="url({{picture}})"></div>
  <div *ngIf="!picture" class="user-picture background" [style.background-color]="color">
    <ng-container *ngIf="showInitialsValue">
      {{ getInitials() }}
    </ng-container>
  </div>

  <div class="info-container">
    <div *ngIf="showNameValue && name" class="user-name">{{ name }}</div>
    <div *ngIf="showTitleValue && title" class="user-title">{{ title }}</div>
  </div>

  <div *ngIf="hasMenu()"
        [ngStyle]="{display: isMenuShown ? 'block' : 'none'}" class="user-context-menu">
    <ul>
      <li class="arrow"></li>
      <li *ngFor="let item of menu">
        <span *ngIf="item.icon" class="item-icon {{ item.icon  }}"></span>
        <a *ngIf="item.link && !item.url" [routerLink]="item.link" [attr.target]="item.target">{{ item.title }}</a>
        <a *ngIf="item.url && !item.link" [attr.href]="item.url" [attr.target]="item.target">{{ item.title }}</a>
        <a *ngIf="!item.link && !item.url" href="#" [attr.target]="item.target"
                                                    (click)="itemClick($event, item)">{{ item.title }}</a>
      </li>
    </ul>
  </div>
</div>