From ca4e7e6febeed6a77b73b4ffeaa0201be2f9abfa Mon Sep 17 00:00:00 2001
From: Sofia Papacharalampous <spapacharalampous@cite.gr>
Date: Wed, 3 Apr 2024 15:54:43 +0300
Subject: [PATCH] ui fixes

*reference dialog
---
 .../reference-dialog-editor.component.html    | 74 ++++++++++---------
 1 file changed, 38 insertions(+), 36 deletions(-)

diff --git a/dmp-frontend/src/app/ui/reference/reference-field/editor/reference-dialog-editor.component.html b/dmp-frontend/src/app/ui/reference/reference-field/editor/reference-dialog-editor.component.html
index 373ceaa0f..0d93b83bf 100644
--- a/dmp-frontend/src/app/ui/reference/reference-field/editor/reference-dialog-editor.component.html
+++ b/dmp-frontend/src/app/ui/reference/reference-field/editor/reference-dialog-editor.component.html
@@ -1,43 +1,45 @@
-<form *ngIf="formGroup" [formGroup]="formGroup">
-	<div class="row d-flex flex-row">
-		<div mat-dialog-title class="col-auto">
-			{{'REFERENCE-FIELD.REFERENCE-DIALOG-EDITOR.TITLE' | translate}} {{label}}
-		</div>
-		<div class="col-auto ml-auto close-btn" (click)="close()">
-			<mat-icon>close</mat-icon>
-		</div>
-	</div>
-	<div mat-dialog-content class="row">
-		<div *ngFor="let field of systemFields;">
-			<div class="col">
-				<mat-form-field class="w-100">
-					<mat-label>{{field}}</mat-label>
-					<input matInput type="text" [name]="field" [formControl]="formGroup.get(field)">
-					<mat-error *ngIf="formGroup.get(field).hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
-					<ng-container *ngIf="field == systemFields[0]">
-						<i matSuffix class="fa fa-spinner fa-spin" *ngIf="formGroup.get(field).pending && !referenceExists"></i>
-						<mat-icon *ngIf="!formGroup.get(field).pending && formGroup.get(field).dirty && formGroup.get(field).valid && !referenceExists" class="text-success" matSuffix>check</mat-icon>
-						<mat-icon *ngIf="!formGroup.get(field).pending && formGroup.get(field).dirty && formGroup.get(field).invalid || referenceExists" class="text-danger" matSuffix>clear</mat-icon>
-						<small *ngIf="referenceExists" class="text-danger">{{'REFERENCE-FIELD.REFERENCE-DIALOG-EDITOR.IDENTIFIER-EXISTS' | translate}}</small>
-					</ng-container>
-				</mat-form-field>
+<div class="container-fluid">
+	<form *ngIf="formGroup" [formGroup]="formGroup">
+		<div class="row d-flex flex-row">
+			<div mat-dialog-title class="col-auto">
+				{{'REFERENCE-FIELD.REFERENCE-DIALOG-EDITOR.TITLE' | translate}} {{label}}
+			</div>
+			<div class="col-auto ml-auto close-btn" (click)="close()">
+				<mat-icon>close</mat-icon>
 			</div>
 		</div>
-		<ng-container *ngIf="referenceType && referenceType.definition && referenceType.definition.fields && referenceType.definition.fields.length > 0">
-			<div *ngFor="let field of referenceType.definition.fields;">
+		<div mat-dialog-content class="row">
+			<div *ngFor="let field of systemFields;">
 				<div class="col">
 					<mat-form-field class="w-100">
-						<mat-label>{{field.label}}</mat-label>
-						<input matInput type="text" [name]="field.code" [formControl]="formGroup.get(field.code)">
-						<mat-error *ngIf="formGroup.get(field.code).hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
+						<mat-label>{{field}}</mat-label>
+						<input matInput type="text" [name]="field" [formControl]="formGroup.get(field)">
+						<mat-error *ngIf="formGroup.get(field).hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
+						<ng-container *ngIf="field == systemFields[0]">
+							<i matSuffix class="fa fa-spinner fa-spin" *ngIf="formGroup.get(field).pending && !referenceExists"></i>
+							<mat-icon *ngIf="!formGroup.get(field).pending && formGroup.get(field).dirty && formGroup.get(field).valid && !referenceExists" class="text-success" matSuffix>check</mat-icon>
+							<mat-icon *ngIf="!formGroup.get(field).pending && formGroup.get(field).dirty && formGroup.get(field).invalid || referenceExists" class="text-danger" matSuffix>clear</mat-icon>
+							<small *ngIf="referenceExists" class="text-danger">{{'REFERENCE-FIELD.REFERENCE-DIALOG-EDITOR.IDENTIFIER-EXISTS' | translate}}</small>
+						</ng-container>
 					</mat-form-field>
 				</div>
 			</div>
-		</ng-container>
-		
-	</div>
-	<div mat-dialog-actions class="row">
-		<div class="ml-auto col-auto"><button mat-raised-button type="button" mat-dialog-close>Cancel</button></div>
-		<div class="col-auto"><button mat-button color="primary" [disabled]="!isFormValid" (click)="send()" type="button">Save</button></div>
-	</div>
-</form>
+			<ng-container *ngIf="referenceType && referenceType.definition && referenceType.definition.fields && referenceType.definition.fields.length > 0">
+				<div *ngFor="let field of referenceType.definition.fields;">
+					<div class="col">
+						<mat-form-field class="w-100">
+							<mat-label>{{field.label}}</mat-label>
+							<input matInput type="text" [name]="field.code" [formControl]="formGroup.get(field.code)">
+							<mat-error *ngIf="formGroup.get(field.code).hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
+						</mat-form-field>
+					</div>
+				</div>
+			</ng-container>
+			
+		</div>
+		<div mat-dialog-actions class="row">
+			<div class="ml-auto col-auto"><button mat-raised-button type="button" mat-dialog-close>Cancel</button></div>
+			<div class="col-auto"><button mat-button color="primary" [disabled]="!isFormValid" (click)="send()" type="button">Save</button></div>
+		</div>
+	</form>
+</div>