styling changes

*close navbar dialogs on screen resize

dmp-frontend/src/app/ui/inapp-notification/listing-dialog/mine-inapp-notification-listing-dialog.component.ts

@@ -1,5 +1,6 @@
+import { fromEvent, Observable, Subscription } from "rxjs";
 import { HttpErrorResponse } from '@angular/common/http';
-import { Component, Inject, OnInit } from '@angular/core';
+import { Component, Inject, OnDestroy, OnInit } from '@angular/core';
 import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { Router } from '@angular/router';
 import { AuthService } from '@app/core/services/auth/auth.service';
@@ -19,10 +20,13 @@ import { IsActive } from '@app/core/common/enum/is-active.enum';
 	templateUrl: './mine-inapp-notification-listing-dialog.component.html',
 	styleUrls: ['./mine-inapp-notification-listing-dialog.component.scss']
 })
-export class MineInAppNotificationListingDialogComponent extends BaseComponent implements OnInit {
+export class MineInAppNotificationListingDialogComponent extends BaseComponent implements OnInit, OnDestroy {
 	public inappNotifications = new Array<InAppNotification>();
 	public notificationInAppTrackingEnum = NotificationInAppTracking;
 
+	resizeObservable: Observable<Event>;
+	resizeSubscription: Subscription;
+
 	constructor(
 		public dialogRef: MatDialogRef<MineInAppNotificationListingDialogComponent>,
 		@Inject(MAT_DIALOG_DATA) public dialogData: any,
@@ -56,6 +60,17 @@ export class MineInAppNotificationListingDialogComponent extends BaseComponent i
 				},
 				error => this.onCallbackError(error),
 			);
+
+			this.resizeObservable = fromEvent(window, 'resize');
+			this.resizeSubscription = this.resizeObservable
+				.subscribe(evt =>{
+					this.dialogRef.close();
+				});
+
+	}
+
+	ngOnDestroy(): void {
+		this.resizeSubscription.unsubscribe();
 	}
 
 	private onCallbackError(errorResponse: HttpErrorResponse) {

dmp-frontend/src/app/ui/navbar/navbar.component.html

@@ -29,7 +29,7 @@
 						<mat-icon>arrow_drop_down</mat-icon>
 					</button>
 					<mat-menu #languageMenu="matMenu" class="lang-parent">
-						<app-language (languageChange)="getLanguage($event)"></app-language>
+						<app-language (languageChange)="getLanguage($event)" class="d-lg-block d-none"></app-language>
 					</mat-menu>
 				</div>
 				<div class="col-auto" *ngIf="isAuthenticated() && authentication.hasPermission(authentication.permissionEnum.ViewMineInAppNotificationPage)">

dmp-frontend/src/app/ui/navbar/user-dialog/user-dialog.component.ts

@@ -1,18 +1,22 @@
-import { Component, Inject, OnInit } from '@angular/core';
+import { Component, Inject, OnDestroy, OnInit } from '@angular/core';
 import { UntypedFormGroup } from '@angular/forms';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import { Router } from '@angular/router';
 import { AuthService } from '../../../core/services/auth/auth.service';
+import { Observable, Subscription, fromEvent } from 'rxjs';
 
 @Component({
 	selector: 'app-user-dialog-component',
 	templateUrl: 'user-dialog.component.html',
 	styleUrls: ['user-dialog.component.scss']
 })
-export class UserDialogComponent implements OnInit {
+export class UserDialogComponent implements OnInit, OnDestroy  {
 
 	public formGroup: UntypedFormGroup;
 
+	resizeObservable: Observable<Event>;
+	resizeSubscription: Subscription;
+
 	constructor(
 		private authentication: AuthService,
 		private router: Router,
@@ -21,6 +25,15 @@ export class UserDialogComponent implements OnInit {
 	) { }
 
 	ngOnInit(): void {
+		this.resizeObservable = fromEvent(window, 'resize');
+		this.resizeSubscription = this.resizeObservable
+			.subscribe(evt =>{
+				this.dialogRef.close();
+			});
+	}
+
+	ngOnDestroy(): void {
+		this.resizeSubscription.unsubscribe();
 	}
 
 	public logout(): void {