From 4ec33481cd7b3bb12e12bd9d28a35e73aab7e286 Mon Sep 17 00:00:00 2001 From: HardiReady Date: Mon, 25 Feb 2019 10:10:41 +0100 Subject: [PATCH] Fix dropdown menu active indicator (CC-90) --- static/src/app/app.component.html | 6 ++- static/src/app/app.component.ts | 8 ++-- .../navigation-header.component.html | 37 +++++++++++++------ .../navigation-header.component.scss | 5 ++- .../navigation/navigation-header.component.ts | 6 ++- .../navigation/sidenav-list.component.html | 35 ++++++++++++------ .../navigation/sidenav-list.component.scss | 4 ++ .../navigation/sidenav-list.component.ts | 4 +- 8 files changed, 72 insertions(+), 33 deletions(-) diff --git a/static/src/app/app.component.html b/static/src/app/app.component.html index dbfbca3..8393bea 100644 --- a/static/src/app/app.component.html +++ b/static/src/app/app.component.html @@ -2,12 +2,14 @@ + (userLogout)="logout()" + [currentUrl]="currentUrl"> + (userLogout)="logout()" + [currentUrl]="currentUrl"> diff --git a/static/src/app/app.component.ts b/static/src/app/app.component.ts index b82c68a..9a7d605 100644 --- a/static/src/app/app.component.ts +++ b/static/src/app/app.component.ts @@ -7,7 +7,7 @@ import {SpinnerService} from './services/user-interface/spinner/spinner.service' import {SnackBarService} from './services/user-interface/snack-bar/snack-bar.service'; import {Observable} from 'rxjs'; import {LoginService} from './services/app-user-service/login-service'; -import {BaseConfig, RouteConfig} from './app.config'; +import {RouteConfig} from './app.config'; @Component({ @@ -23,6 +23,8 @@ export class AppComponent implements OnInit { scrollBtnVisibleVal = 100; + currentUrl = ''; + // a map of svgIcon names and associated svg file names // to load from assets/icon folder svgIcons = { @@ -83,10 +85,10 @@ export class AppComponent implements OnInit { } if (event instanceof NavigationEnd) { this.spinnerService.deactivate(); - const currentUrl = this.router.url; + this.currentUrl = this.router.url; // scroll to top on route from army overview to user detail and back - if (currentUrl.includes('/overview') || currentUrl.includes('/public')) { + if (this.currentUrl.includes('/overview') || this.currentUrl.includes('/public')) { this.scrollToTop(); } } diff --git a/static/src/app/common/navigation/navigation-header.component.html b/static/src/app/common/navigation/navigation-header.component.html index 6097970..e4c3638 100644 --- a/static/src/app/common/navigation/navigation-header.component.html +++ b/static/src/app/common/navigation/navigation-header.component.html @@ -29,7 +29,8 @@
  • {{'navigation.top.statistics' | translate}}
    • -
  • +
  • {{'navigation.top.management' | translate}} @@ -37,21 +38,26 @@ - - - -
    • -
  • +
  • {{'navigation.top.request' | translate}} @@ -59,18 +65,22 @@ - - -
    • -
  • +
  • @@ -80,10 +90,12 @@ @@ -93,7 +105,8 @@
      -
    • +
    • {{'navigation.top.admin' | translate}} @@ -101,7 +114,7 @@ - diff --git a/static/src/app/common/navigation/navigation-header.component.scss b/static/src/app/common/navigation/navigation-header.component.scss index bf18115..071e6cb 100644 --- a/static/src/app/common/navigation/navigation-header.component.scss +++ b/static/src/app/common/navigation/navigation-header.component.scss @@ -66,5 +66,8 @@ mat-toolbar { margin: auto; } } - +} + +button.active { + background: #dadada; } diff --git a/static/src/app/common/navigation/navigation-header.component.ts b/static/src/app/common/navigation/navigation-header.component.ts index ecf4dd5..7996685 100644 --- a/static/src/app/common/navigation/navigation-header.component.ts +++ b/static/src/app/common/navigation/navigation-header.component.ts @@ -1,4 +1,4 @@ -import {Component, EventEmitter, OnInit, Output} from '@angular/core'; +import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core'; import {BaseConfig, RouteConfig} from '../../app.config'; import {environment} from '../../../environments/environment'; import {LoginService} from '../../services/app-user-service/login-service'; @@ -20,13 +20,15 @@ export class NavigationHeaderComponent implements OnInit { @Output() userLogout = new EventEmitter(); + @Input() currentUrl; + readonly features = environment.features; readonly availableLanguages = BaseConfig.i18n.availableLanguages; readonly version = require('./../../../../../package.json').version; - config = RouteConfig; + readonly config = RouteConfig; language; diff --git a/static/src/app/common/navigation/sidenav-list.component.html b/static/src/app/common/navigation/sidenav-list.component.html index 9f2cd1c..725fd3b 100644 --- a/static/src/app/common/navigation/sidenav-list.component.html +++ b/static/src/app/common/navigation/sidenav-list.component.html @@ -16,6 +16,7 @@ {{'navigation.top.management' | translate}} @@ -23,21 +24,23 @@ - - - - {{'navigation.top.request' | translate}} @@ -45,19 +48,22 @@ - - - {{'navigation.top.request.manage' | translate}} @@ -66,25 +72,30 @@ - + {{'navigation.top.admin' | translate}} - diff --git a/static/src/app/common/navigation/sidenav-list.component.scss b/static/src/app/common/navigation/sidenav-list.component.scss index fb97d91..1baa59e 100644 --- a/static/src/app/common/navigation/sidenav-list.component.scss +++ b/static/src/app/common/navigation/sidenav-list.component.scss @@ -23,3 +23,7 @@ mat-divider { margin: 15% 0; border-color: #9d9d9d; } + +button.active { + background: #dadada; +} diff --git a/static/src/app/common/navigation/sidenav-list.component.ts b/static/src/app/common/navigation/sidenav-list.component.ts index 88d8aac..9f2304e 100644 --- a/static/src/app/common/navigation/sidenav-list.component.ts +++ b/static/src/app/common/navigation/sidenav-list.component.ts @@ -1,4 +1,4 @@ -import {Component, EventEmitter, OnInit, Output} from '@angular/core'; +import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core'; import {BaseConfig, RouteConfig} from '../../app.config'; import {LoginService} from '../../services/app-user-service/login-service'; import {PromotionService} from '../../services/army-management/promotion.service'; @@ -18,6 +18,8 @@ export class SidenavListComponent implements OnInit { @Output() userLogout = new EventEmitter(); + @Input() currentUrl; + readonly features = environment.features; readonly availableLanguages = BaseConfig.i18n.availableLanguages;