aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/shared/menu
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/app/shared/menu')
-rw-r--r--client/src/app/shared/menu/top-menu-dropdown.component.html6
-rw-r--r--client/src/app/shared/menu/top-menu-dropdown.component.scss9
-rw-r--r--client/src/app/shared/menu/top-menu-dropdown.component.ts10
3 files changed, 23 insertions, 2 deletions
diff --git a/client/src/app/shared/menu/top-menu-dropdown.component.html b/client/src/app/shared/menu/top-menu-dropdown.component.html
index d3c896019..8d58fa1db 100644
--- a/client/src/app/shared/menu/top-menu-dropdown.component.html
+++ b/client/src/app/shared/menu/top-menu-dropdown.component.html
@@ -13,7 +13,11 @@
13 </span> 13 </span>
14 14
15 <div ngbDropdownMenu> 15 <div ngbDropdownMenu>
16 <a *ngFor="let menuChild of menuEntry.children" class="dropdown-item" [routerLink]="menuChild.routerLink">{{ menuChild.label }}</a> 16 <a *ngFor="let menuChild of menuEntry.children" class="dropdown-item" [ngClass]="{ icon: hasIcons }" [routerLink]="menuChild.routerLink">
17 <my-global-icon *ngIf="menuChild.iconName" [iconName]="menuChild.iconName"></my-global-icon>
18
19 {{ menuChild.label }}
20 </a>
17 </div> 21 </div>
18 </div> 22 </div>
19 23
diff --git a/client/src/app/shared/menu/top-menu-dropdown.component.scss b/client/src/app/shared/menu/top-menu-dropdown.component.scss
index 77159532f..d7c7de957 100644
--- a/client/src/app/shared/menu/top-menu-dropdown.component.scss
+++ b/client/src/app/shared/menu/top-menu-dropdown.component.scss
@@ -1,3 +1,6 @@
1@import '_variables';
2@import '_mixins';
3
1.parent-entry { 4.parent-entry {
2 span[role=button] { 5 span[role=button] {
3 cursor: pointer; 6 cursor: pointer;
@@ -16,3 +19,9 @@
16/deep/ .dropdown-menu { 19/deep/ .dropdown-menu {
17 margin-top: 0 !important; 20 margin-top: 0 !important;
18} 21}
22
23.icon {
24 @include dropdown-with-icon-item;
25
26 top: -1px;
27}
diff --git a/client/src/app/shared/menu/top-menu-dropdown.component.ts b/client/src/app/shared/menu/top-menu-dropdown.component.ts
index e859c30dd..e951ea236 100644
--- a/client/src/app/shared/menu/top-menu-dropdown.component.ts
+++ b/client/src/app/shared/menu/top-menu-dropdown.component.ts
@@ -3,6 +3,7 @@ import { filter, take } from 'rxjs/operators'
3import { NavigationEnd, Router } from '@angular/router' 3import { NavigationEnd, Router } from '@angular/router'
4import { Subscription } from 'rxjs' 4import { Subscription } from 'rxjs'
5import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap' 5import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap'
6import { GlobalIconName } from '@app/shared/images/global-icon.component'
6 7
7export type TopMenuDropdownParam = { 8export type TopMenuDropdownParam = {
8 label: string 9 label: string
@@ -11,6 +12,8 @@ export type TopMenuDropdownParam = {
11 children?: { 12 children?: {
12 label: string 13 label: string
13 routerLink: string 14 routerLink: string
15
16 iconName?: GlobalIconName
14 }[] 17 }[]
15} 18}
16 19
@@ -23,6 +26,7 @@ export class TopMenuDropdownComponent implements OnInit, OnDestroy {
23 @Input() menuEntries: TopMenuDropdownParam[] = [] 26 @Input() menuEntries: TopMenuDropdownParam[] = []
24 27
25 suffixLabels: { [ parentLabel: string ]: string } 28 suffixLabels: { [ parentLabel: string ]: string }
29 hasIcons = false
26 30
27 private openedOnHover = false 31 private openedOnHover = false
28 private routeSub: Subscription 32 private routeSub: Subscription
@@ -35,6 +39,10 @@ export class TopMenuDropdownComponent implements OnInit, OnDestroy {
35 this.routeSub = this.router.events 39 this.routeSub = this.router.events
36 .pipe(filter(event => event instanceof NavigationEnd)) 40 .pipe(filter(event => event instanceof NavigationEnd))
37 .subscribe(() => this.updateChildLabels(window.location.pathname)) 41 .subscribe(() => this.updateChildLabels(window.location.pathname))
42
43 this.hasIcons = this.menuEntries.some(
44 e => e.children && e.children.some(c => !!c.iconName)
45 )
38 } 46 }
39 47
40 ngOnDestroy () { 48 ngOnDestroy () {
@@ -48,7 +56,7 @@ export class TopMenuDropdownComponent implements OnInit, OnDestroy {
48 // Menu was closed 56 // Menu was closed
49 dropdown.openChange 57 dropdown.openChange
50 .pipe(take(1)) 58 .pipe(take(1))
51 .subscribe(e => this.openedOnHover = false) 59 .subscribe(() => this.openedOnHover = false)
52 } 60 }
53 61
54 dropdownAnchorClicked (dropdown: NgbDropdown) { 62 dropdownAnchorClicked (dropdown: NgbDropdown) {