Merge branch 'dmp-refactoring' of https://code-repo.d4science.org/MaDgiK-CITE/argos into dmp-refactoring

dmp-frontend/src/notification-service/ui/inapp-notification/listing/filters/mine-inapp-notification-listing-filters.component.html

@@ -7,35 +7,47 @@
 
 
 	<mat-menu #filterMenu>
-		<div class="p-3" (click)="$event?.stopPropagation?.()">
-			<div class="search-listing-filters-container">
-				<div class="d-flex align-items-center justify-content-between">
+		<div class="container-fluid" (click)="$event?.stopPropagation?.()">
+			<div class="row justify-content-between">
+				<div class="col-auto mt-2">
 					<h4>{{'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FILTER.TITLE' | translate}}</h4>
+				</div>
+				<div class="col-auto">
 					<button color="accent" mat-button (click)="clearFilters()">
 						{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
 					</button>
 				</div>
+			</div>
 
-				<div>
-					<mat-label>{{'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FILTER.NOTIFICATION-TYPE' | translate}}
+			<div class="mt-3 row">
+				<div class="col-12">
+					<mat-form-field class="w-100">
+						<mat-label>{{'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FILTER.NOTIFICATION-TYPE' | translate}}</mat-label>
 						<mat-select multiple [(ngModel)]="internalFilters.type">
 							<mat-option *ngFor="let type of notificationTypeEnumValues" [value]="type">{{enumUtils.toNotificationTypeString(type)}}</mat-option>
 						</mat-select>
-					</mat-label>
+					</mat-form-field>
 				</div>
-				<div>
-					<mat-label>{{'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FILTER.TRACKING-STATE' | translate}}
+			</div>
+			<div class="row">
+				<div class="col-12">
+					<mat-form-field class="w-100">
+						<mat-label>{{'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FILTER.TRACKING-STATE' | translate}}</mat-label>
 						<mat-select multiple [(ngModel)]="internalFilters.trackingState">
 							<mat-option *ngFor="let state of notificationInAppTrackingEnumValues" [value]="state">{{enumUtils.toNotificationInAppTrackingString(state)}}</mat-option>
 						</mat-select>
-					</mat-label>
+					</mat-form-field>
 				</div>
+			</div>
 
-				<div class="d-flex justify-content-end align-items-center mt-4 gap-1-rem">
-					<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
+			<div class="row justify-content-end align-items-center mt-4 gap-1-rem">
+				<div class="col-auto">
+					<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
 						{{'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FILTER.CANCEL' | translate}}
 					</button>
-					<button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
+				</div>
+				<div class="col-auto">
+					<button class="normal-btn-sm" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
 						{{'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FILTER.APPLY-FILTERS' | translate}}
 					</button>
 				</div>