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 }}" [class.dropdown-menu]="subCategoriesDepth === 1">
    @for (subcategory of categories; track subcategory.uniqueId) {
      <li class="main-navigation-level{{ subCategoriesDepth }}-item" [class.open]="isOpened(subcategory.uniqueId)">
        <a
          [routerLink]="subcategory.url"
          [style.width]="
            !(subCategoriesDepth < mainNavigationMaxSubCategoriesDepth && subcategory.hasChildren) ? '100%' : ''
          "
          >{{ subcategory.name }}</a
        >
        @if (subCategoriesDepth < mainNavigationMaxSubCategoriesDepth && subcategory.hasChildren) {
          <a
            class="dropdown-toggle"
            role="button"
            tabindex="0"
            [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 })
            "
            [class.d-none]="view === 'full'"
            (click)="toggleOpen(subcategory.uniqueId)"
            (keydown.enter)="toggleOpen(subcategory.uniqueId)"
          >
            @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>
}