sxhundred/ISA-Frontend
1
0
Fork 0
mirror of https://dev.azure.com/hugendubel/ISA/_git/ISA-Frontend synced 2025-12-28 22:42:11 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merged PR 1560: #4082 Sidenav Arrow Navigation Fix

Browse Source 
#4082 Sidenav Arrow Navigation Fix
This commit is contained in:
Nino Righi
2023-06-09 12:45:45 +00:00
committed by Andreas Schickinger
parent be1a9e8f7e
commit f247ac641c
2 changed files with 47 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
apps/shared/shell/src/lib/side-menu/side-menu.component.css
View File

@@ -27,15 +27,15 @@
}
.side-menu-group-item {
@apply text-p2 flex flex-row items-center px-[0.438rem] py-3 bg-[#EDEFF0] text-black rounded cursor-pointer;
}
.side-menu-group-link {
@apply flex flex-row items-center grow;
@apply text-p2 flex flex-row items-center bg-[#EDEFF0] text-black rounded cursor-pointer;
}
.side-menu-group-item-label {
@apply whitespace-nowrap;
@apply whitespace-nowrap grow py-3;
}
.side-menu-group-arrow {
@apply px-[0.438rem] py-3;
}
.side-menu-group-item.active,
@@ -59,11 +59,7 @@
}
.side-menu-group-item-icon {
@apply w-6 h-6 shrink-0 grid items-center justify-center mr-[0.438rem];
}
.side-menu-group-item-label {
@apply grow;
@apply shrink-0 grid items-center justify-center px-[0.438rem] py-3;
}
/* :host {

76
apps/shared/shell/src/lib/side-menu/side-menu.component.html
View File

@@ -16,24 +16,26 @@
</a>
<div class="side-menu-group-sub-item-wrapper">
<div class="side-menu-group-item">
<a
class="side-menu-group-link"
(click)="closeSideMenu(); focusSearchBox()"
[routerLink]="[customerBasePath$ | async, 'customer']"
routerLinkActive="active"
>
<span class="side-menu-group-item-icon">
<ui-svg-icon icon="person"></ui-svg-icon>
</span>
<span class="side-menu-group-item-label">
Kunden
</span>
</a>
<span class="side-menu-group-arrow" [class.side-menu-item-rotate]="customerExpanded" (click)="customerExpanded = !customerExpanded">
<ui-svg-icon icon="keyboard-arrow-down"></ui-svg-icon>
<a
class="side-menu-group-item"
(click)="closeSideMenu(); focusSearchBox()"
[routerLink]="[customerBasePath$ | async, 'customer']"
routerLinkActive="active"
>
<span class="side-menu-group-item-icon">
<ui-svg-icon icon="person"></ui-svg-icon>
</span>
</div>
<span class="side-menu-group-item-label">
Kunden
</span>
<button
class="side-menu-group-arrow"
[class.side-menu-item-rotate]="customerExpanded"
(click)="$event.stopPropagation(); $event.preventDefault(); customerExpanded = !customerExpanded"
>
<ui-svg-icon icon="keyboard-arrow-down"></ui-svg-icon>
</button>
</a>
<div class="side-menu-group-sub-items" [class.hidden]="!customerExpanded">
<a
@@ -130,26 +132,28 @@
</a>
<div class="side-menu-group-sub-item-wrapper">
<div class="side-menu-group-item">
<a
class="side-menu-group-link"
(click)="closeSideMenu(); focusSearchBox()"
*ngIf="goodsInNavigation$ | async; let goodsInNavigation"
[routerLink]="goodsInNavigation.path"
[queryParams]="goodsInNavigation.queryParams"
routerLinkActive="active"
>
<span class="side-menu-group-item-icon">
<ui-svg-icon icon="isa-abholfach"></ui-svg-icon>
</span>
<span class="side-menu-group-item-label">
Abholfach
</span>
</a>
<span class="side-menu-group-arrow" [class.side-menu-item-rotate]="goodsInExpanded" (click)="goodsInExpanded = !goodsInExpanded">
<ui-svg-icon icon="keyboard-arrow-down"></ui-svg-icon>
<a
class="side-menu-group-item"
(click)="closeSideMenu(); focusSearchBox()"
*ngIf="goodsInNavigation$ | async; let goodsInNavigation"
[routerLink]="goodsInNavigation.path"
[queryParams]="goodsInNavigation.queryParams"
routerLinkActive="active"
>
<span class="side-menu-group-item-icon">
<ui-svg-icon icon="isa-abholfach"></ui-svg-icon>
</span>
</div>
<span class="side-menu-group-item-label">
Abholfach
</span>
<button
class="side-menu-group-arrow"
[class.side-menu-item-rotate]="goodsInExpanded"
(click)="$event.stopPropagation(); $event.preventDefault(); goodsInExpanded = !goodsInExpanded"
>
<ui-svg-icon icon="keyboard-arrow-down"></ui-svg-icon>
</button>
</a>
<div class="side-menu-group-sub-items" [class.hidden]="!goodsInExpanded">
<a