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

dmp-frontend/src/app/ui/admin/dmp-blueprint/listing/filters/dmp-blueprint-listing-filters.component.html

@@ -7,32 +7,46 @@
 
 
 	<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>{{'DMP-BLUEPRINT-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>
-
-				<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
-					{{'DMP-BLUEPRINT-LISTING.FILTER.IS-ACTIVE' | translate}}
-				</mat-slide-toggle>
-
-				<div>
-					<mat-label>{{'DMP-BLUEPRINT-LISTING.FILTER.STATUS' | translate}}
+			</div>
+				
+			<div class="row mt-3">
+				<div class="col-12">
+					<section class="w-100">
+						<mat-slide-toggle [(ngModel)]="internalFilters.isActive" labelPosition="before">
+							{{'DMP-BLUEPRINT-LISTING.FILTER.IS-ACTIVE' | translate}}</mat-slide-toggle>
+					</section>
+				</div>
+			</div>
+				
+			<div class="row mt-3">
+				<div class="col-12">
+					<mat-form-field class="w-100">
+						<mat-label>{{'DMP-BLUEPRINT-LISTING.FILTER.STATUS' | translate}}</mat-label>
 						<mat-select multiple [(ngModel)]="internalFilters.statuses">
 							<mat-option *ngFor="let blueprintStatus of dmpBlueprintStatusEnumValues" [value]="blueprintStatus">{{enumUtils.toDmpBlueprintStatusString(blueprintStatus)}}</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()">
 						{{'DMP-BLUEPRINT-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();">
 						{{'DMP-BLUEPRINT-LISTING.FILTER.APPLY-FILTERS' | translate}}
 					</button>
 				</div>

dmp-frontend/src/app/ui/admin/dmp-blueprint/listing/filters/dmp-blueprint-listing-filters.component.scss

@@ -22,4 +22,8 @@
 	// }
 }
 
-
+::ng-deep .mdc-form-field {
+	label {
+		margin: 0;
+	}
+}