catalog-ui/src/app/ng2/components/layout/top-nav/top-nav.component.html

   1 <nav class="top-nav">
   2
   3     <div class="asdc-app-title-wrapper">
   4         <a class="asdc-app-title">{{ 'PROJECT_TITLE'|translate }}</a>
   5         <div class="asdc-version"> v.{{version}}</div>
   6     </div>
   7
   8     <ul class="top-menu" *ngIf="!menuModel && topLvlMenu">
   9         <!-- no hierarchy & dropdowns mode -->
  10         <li *ngFor="let item of topLvlMenu.menuItems; let i = index"
  11             [ngClass]="{'selected': i == topLvlMenu.selectedIndex}">
  12             <a (click)="menuItemClick(topLvlMenu, item)"
  13                [attr.data-tests-id]="'main-menu-button-' + item.text.toLowerCase()">{{item.text}}</a>
  14         </li>
  15     </ul>
  16
  17     <ul class="top-menu" *ngIf="menuModel">
  18         <!-- with hierarchy & dropdowns mode -->
  19         <ng-container *ngFor="let groupItem of menuModel; let $index = index; let $last = last">
  20             <li [ngClass]="{'selected': $last }">
  21                 <a (click)="menuItemClick(groupItem, groupItem.menuItems[groupItem.selectedIndex])"
  22                    [attr.data-tests-id]="'breadcrumbs-button-' + $index">
  23                     {{groupItem.menuItems[groupItem.selectedIndex]?.text}}
  24                 </a>
  25             </li>
  26             <li class="triangle-dropdown"
  27                 [ngClass]="{'item-click': groupItem.itemClick}" (mouseover)="groupItem.itemClick = true">
  28                 <div class="triangle"><span class="sprite-new arrow-right"></span></div>
  29                 <ul class="sub-menu">
  30                     <li *ngFor="let ddItem of groupItem.menuItems; let $index2 = index"
  31                         (click)="menuItemClick(groupItem, ddItem)"
  32                         [ngClass]="{'selected': $index2 == groupItem.selectedIndex, 'disabled': ddItem.isDisabled}"
  33                         [attr.data-tests-id]="'sub-menu-button-' + ddItem.text.toLowerCase()">
  34                         <span sdc-smart-tooltip="">{{ddItem.text}}</span>
  35                     </li>
  36                 </ul>
  37             </li>
  38         </ng-container>
  39     </ul>
  40
  41     <div class="top-search" [hidden]="hideSearch === true">
  42         <input type="text"
  43                class="search-text"
  44                placeholder="Search"
  45                [ngModel]="searchTerm"
  46                (ngModelChange)="emitSearchTerm($event)"
  47                data-tests-id="main-menu-input-search" />
  48         <span class="w-sdc-search-icon magnification"></span>
  49     </div>
  50
  51     <div class="notification-icon" [ngClass]="{'disabled' : progress > 0}" *ngIf="user.role === 'DESIGNER' && notificationIconCallback" (click)="notificationIconCallback()" tooltip="Vendor Software Product Repository" tooltipPlacement="left" data-tests-id="repository-icon"></div>
  52
  53 </nav>