All files / src/app/shell/header/sub-category-navigation sub-category-navigation.component.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
1x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
@if (navigationCategories$ | async; as categories) {
<ul class="category-level{{ subCategoriesDepth }}" [ngClass]="{ 'dropdown-menu': subCategoriesDepth === 1 }">
  @for (subcategory of categories; track subcategory.uniqueId) {
  <li class="main-navigation-level{{ subCategoriesDepth }}-item" [ngClass]="{ open: isOpened(subcategory.uniqueId) }">
    <a
      [routerLink]="subcategory.url"
      [ngStyle]="{
        width: !(subCategoriesDepth < mainNavigationMaxSubCategoriesDepth && subcategory.hasChildren) ? '100%' : ''
      }"
      >{{ subcategory.name }}</a
    >
    @if (subCategoriesDepth < mainNavigationMaxSubCategoriesDepth && subcategory.hasChildren) {
    <a
      class="dropdown-toggle"
      [ngClass]="{ 'd-none': view === 'full' }"
      (click)="toggleOpen(subcategory.uniqueId)"
      (keydown.enter)="toggleOpen(subcategory.uniqueId)"
      role="button"
      [attr.aria-label]="
        isOpened(subcategory.uniqueId)
          ? ('header.navigation.collapse_category.aria_label' | translate : { '0': subcategory.name })
          : ('header.navigation.expand_category.aria_label' | translate : { '0': subcategory.name })
      "
      tabindex="0"
    >
      @if (isOpened(subcategory.uniqueId)) {
      <i class="bi bi-dash"></i>
      } @else {
      <i class="bi bi-plus"></i>
      }
    </a>
    <ish-sub-category-navigation
      [categoryUniqueId]="subcategory.uniqueId"
      [subCategoriesDepth]="subCategoriesDepth + 1"
    />
    }
  </li>
  }
</ul>
}