diff --git a/goofy-client/libs/navigation/src/lib/navigation/navigation.component.html b/goofy-client/libs/navigation/src/lib/navigation/navigation.component.html index c31f640aa4954daeab7dac7939f665569715932c..624e2e2e4483698171bf5bc8e9ee8a0c65c88272 100644 --- a/goofy-client/libs/navigation/src/lib/navigation/navigation.component.html +++ b/goofy-client/libs/navigation/src/lib/navigation/navigation.component.html @@ -1,9 +1,14 @@ <nav [ngClass]="{ small: navigationCollapse$ | async }"> <ul> <li> - <a routerLink="/" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }" matRipple matRippleColor="rgba(13,71,161, 0.08)"> + <a #home="routerLinkActive" routerLink="/" + routerLinkActive="active" + [routerLinkActiveOptions]="{ exact: true }" + matRipple + matRippleColor="rgba(13,71,161, 0.08)"> <mat-icon>apps</mat-icon> - <span>Alle Vorgänge</span> + <h1 *ngIf="home.isActive; else homeInactive">Alle Vorgänge</h1> + <ng-template #homeInactive><span>Alle Vorgänge</span></ng-template> </a> </li> <!--li> diff --git a/goofy-client/libs/navigation/src/lib/navigation/navigation.component.scss b/goofy-client/libs/navigation/src/lib/navigation/navigation.component.scss index 72a74ca8373ff187f67a10f688c788a0f44bb736..c4a730b68830968cbadea31d511de7aa811c9b3c 100644 --- a/goofy-client/libs/navigation/src/lib/navigation/navigation.component.scss +++ b/goofy-client/libs/navigation/src/lib/navigation/navigation.component.scss @@ -43,10 +43,15 @@ ul { //box-shadow: inset 0 0 0 2px mat-color($primaryPalette, darker); } + h1, span { - margin-left: 20px; + margin: 0 0 0 20px; transition: opacity 0.5s; transition-delay: 0.3s; + font-size: inherit; + color: inherit; + font-weight: inherit; + padding: 0; } } }