From b0cd53d74b03d67637365f58e202001d72f51cbb Mon Sep 17 00:00:00 2001
From: Sofia Papacharalampous <spapacharalampous@cite.gr>
Date: Fri, 22 Mar 2024 11:04:11 +0200
Subject: [PATCH 1/5] styling changes

*dmp-user fields and semantics
---
 .../multiple-auto-complete.component.scss        | 16 +---------------
 .../dmp-user-field/dmp-user-field.component.html | 14 +++++++-------
 .../dmp-user-field/dmp-user-field.component.scss | 13 -------------
 3 files changed, 8 insertions(+), 35 deletions(-)

diff --git a/dmp-frontend/src/app/library/auto-complete/multiple/multiple-auto-complete.component.scss b/dmp-frontend/src/app/library/auto-complete/multiple/multiple-auto-complete.component.scss
index 633e9467d..0c67f1f8c 100644
--- a/dmp-frontend/src/app/library/auto-complete/multiple/multiple-auto-complete.component.scss
+++ b/dmp-frontend/src/app/library/auto-complete/multiple/multiple-auto-complete.component.scss
@@ -28,8 +28,7 @@
 	// text-overflow: ellipsis;
 	// white-space: nowrap;
 	// overflow: hidden;
-	// white-space: normal;
-	white-space: nowrap;
+	white-space: normal;
 	word-break: break-word;
 }
 
@@ -129,16 +128,3 @@
 		color: transparent;
 	}
 }
-
-:host ::ng-deep .mdc-evolution-chip-set__chips {
-  max-width: 100%;
-	text-overflow: ellipsis;
-	flex-flow: nowrap;
-	overflow-x: scroll;
-}
-
-:host ::ng-deep .mat-mdc-standard-chip .mdc-evolution-chip__cell--primary,
-:host ::ng-deep .mat-mdc-standard-chip .mdc-evolution-chip__action--primary,
-:host ::ng-deep .mat-mdc-standard-chip .mat-mdc-chip-action-label {
-  overflow: hidden;
-}
diff --git a/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.html b/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.html
index aa648dd24..1b86486fd 100644
--- a/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.html
+++ b/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.html
@@ -30,18 +30,18 @@
 <ng-template #userForm let-user let-userIndex="index">
 
 
-	<div class="col-auto pb-1">
+	<div class="col-12 col-xl-auto pb-1">
 		<span *ngIf="!isUserSelected(userIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.435rem 0 0.435rem;">{{userIndex + 1}}</span>
 		<mat-icon *ngIf="isUserSelected(userIndex)" [ngClass]="{'drag-handle-disabled': form.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
 	</div>
-	<div class="col-auto user-field">
+	<div class="col-12 col-xl-auto">
 		<mat-button-toggle-group name="fontStyle" aria-label="Font Style" [formControl]="user.get('userType')" class="w-100">
 			<div *ngFor="let userType of dmpUserTypeEnumValues" class="col p-0">
 				<mat-button-toggle class="lang-button w-100" [value]="userType">{{enumUtils.toDmpUserTypeString(userType)}}</mat-button-toggle>
 			</div>
 		</mat-button-toggle-group>
 	</div>
-	<div class="col-auto mt-3 user-field" *ngIf="user.get('userType').value == dmpUserTypeEnum.Internal">
+	<div class="col-12 col-xl mt-3" *ngIf="user.get('userType').value == dmpUserTypeEnum.Internal">
 		<mat-form-field class="w-100">
 			<mat-label>{{'DMP-EDITOR.FIELDS1.USER' | translate}}*</mat-label>
 			<app-single-auto-complete [formControl]="user.get('user')" [hidePlaceholder]="true" [configuration]="userService.singleAutoCompleteDmpAssociatedUserConfiguration"></app-single-auto-complete>
@@ -49,7 +49,7 @@
 			<mat-error *ngIf="user.get('user').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
 		</mat-form-field>
 	</div>
-	<div class="col-auto mt-3 user-field" *ngIf="user.get('userType').value == dmpUserTypeEnum.External">
+	<div class="col-12 col-xl mt-3" *ngIf="user.get('userType').value == dmpUserTypeEnum.External">
 		<mat-form-field class="w-100">
 			<mat-label>{{'DMP-EDITOR.FIELDS1.EMAIL' | translate}}*</mat-label>
 			<input matInput type="text" name="email" [formControl]="user.get('email')">
@@ -57,7 +57,7 @@
 			<mat-error *ngIf="user.get('email').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
 		</mat-form-field>
 	</div>
-	<div class="col-auto mt-3 user-field">
+	<div class="col-12 col-xl mt-3">
 		<mat-form-field class="w-100">
 			<mat-label>{{'DMP-EDITOR.FIELDS1.USER-ROLE' | translate}}</mat-label>
 			<mat-select [formControl]="user.get('role')">
@@ -67,7 +67,7 @@
 			<mat-error *ngIf="user.get('role').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
 		</mat-form-field>
 	</div>
-	<div class="col-auto mt-3 user-field" *ngIf="sections">
+	<div class="col-12 col-xl mt-3" *ngIf="sections">
 		<mat-form-field class="w-100">
 			<mat-label>{{'DMP-EDITOR.FIELDS1.SECTION' | translate}}</mat-label>
 			<mat-select [formControl]="user.get('sectionId')">
@@ -79,7 +79,7 @@
 			<mat-error *ngIf="user.get('sectionId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' |translate}}</mat-error>
 		</mat-form-field>
 	</div>
-	<div class="col-auto user-field">
+	<div class="col-12 col-xl-auto">
 		<button mat-icon-button class="action-list-icon" matTooltip="{{'DMP-EDITOR.ACTIONS1.REMOVE-USER' | translate}}" (click)="removeUser(userIndex)" [disabled]="form.disabled">
 			<mat-icon>delete</mat-icon>
 		</button>
diff --git a/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.scss b/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.scss
index a4808a077..a47f72664 100644
--- a/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.scss
+++ b/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.scss
@@ -13,16 +13,3 @@
 	cursor: auto; 
 	color: rgba(0, 0, 0, 0.38);;
 }
-
-
-@media (max-width:1600px) {
-	
-	.user-fields {
-		flex-direction: column;
-	}
-		
-	.user-field {
-		align-self: flex-start;
-		width: 100%;
-	}
-}
\ No newline at end of file

From ffb5d5ee7e3209847e99549298bb9df65aaee348 Mon Sep 17 00:00:00 2001
From: amentis <amentis@cite.gr>
Date: Fri, 22 Mar 2024 11:45:31 +0200
Subject: [PATCH 2/5] fix lock bug

---
 .../editor/dmp-blueprint-editor.component.html       |  2 +-
 .../editor/description-editor.component.html         | 12 ++++++------
 dmp-frontend/src/common/base/base-editor.ts          |  6 ++----
 3 files changed, 9 insertions(+), 11 deletions(-)

diff --git a/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.html b/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.html
index 90bd7d6f8..a6524cf93 100644
--- a/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.html
+++ b/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.html
@@ -15,7 +15,7 @@
 		</div>
 		<div class="col"></div>
 		<div class="col-auto" *ngIf="!isNew">
-			<button [disabled]="!isLockedByUser" mat-button class="action-btn" type="button" (click)="delete()">
+			<button [disabled]="isLocked" mat-button class="action-btn" type="button" (click)="delete()">
 				<mat-icon>delete</mat-icon>
 				{{'DMP-BLUEPRINT-EDITOR.ACTIONS.DELETE' | translate}}
 			</button>
diff --git a/dmp-frontend/src/app/ui/description/editor/description-editor.component.html b/dmp-frontend/src/app/ui/description/editor/description-editor.component.html
index 6f721cb22..702dbe110 100644
--- a/dmp-frontend/src/app/ui/description/editor/description-editor.component.html
+++ b/dmp-frontend/src/app/ui/description/editor/description-editor.component.html
@@ -47,7 +47,7 @@
 									</mat-menu>
 								</div>
 
-								<mat-divider *ngIf="formGroup.get('id').value && (!viewOnly || (isLockedByUser && !viewOnly) || !isLockedByUser || (hasReversableStatus() && isLockedByUser))" [vertical]="true" class="ml-2 mr-2"></mat-divider>
+								<mat-divider *ngIf="formGroup.get('id').value && (!viewOnly || (!isLocked && !viewOnly) || isLocked || (hasReversableStatus() && !isLocked))" [vertical]="true" class="ml-2 mr-2"></mat-divider>
 
 								<div *ngIf="isDirty() && !viewOnly" class="col-auto d-flex align-items-center pr-0">
 									<button [disabled]="saving" type="button" mat-raised-button class="description-discard-btn" (click)="discardChanges()">
@@ -55,7 +55,7 @@
 									</button>
 								</div>
 								<div class="col-auto d-flex align-items-center">
-									<button [disabled]="saving" *ngIf="isLockedByUser && !viewOnly && hasReversableStatus() == false" mat-raised-button class="description-save-btn mr-2" type="button">
+									<button [disabled]="saving" *ngIf="!isLocked && !viewOnly && hasReversableStatus() == false" mat-raised-button class="description-save-btn mr-2" type="button">
 										<span class="d-flex flex-row row">
 											<span (click)="!saving?formSubmit():null" class="col">{{ 'DESCRIPTION-EDITOR.ACTIONS.SAVE' | translate }}</span>
 											<mat-divider [vertical]="true"></mat-divider>
@@ -73,9 +73,9 @@
 										<button [disabled]="saving" mat-menu-item (click)="save()" type="button">{{ 'DESCRIPTION-EDITOR.ACTIONS.SAVE-AND-CONTINUE' | translate }}</button>
 									</mat-menu>
 
-									<button [disabled]="saving" *ngIf="isLockedByUser && !viewOnly && hasReversableStatus() == false" mat-raised-button class="description-save-btn mr-2" type="button" (click)="finalize()">{{ 'DESCRIPTION-EDITOR.ACTIONS.FINALIZE' | translate }}</button>
-									<button [disabled]="saving" *ngIf="!isLockedByUser" mat-raised-button disabled class="description-save-btn cursor-default" type="button">{{ 'DMP-OVERVIEW.LOCKED' | translate}}</button>
-									<button [disabled]="saving" *ngIf="hasReversableStatus() && isLockedByUser" mat-raised-button class="description-save-btn mr-2" (click)="reverse()" type="button">{{ 'DESCRIPTION-EDITOR.ACTIONS.REVERSE' | translate }}</button>
+									<button [disabled]="saving" *ngIf="!isLocked && !viewOnly && hasReversableStatus() == false" mat-raised-button class="description-save-btn mr-2" type="button" (click)="finalize()">{{ 'DESCRIPTION-EDITOR.ACTIONS.FINALIZE' | translate }}</button>
+									<button [disabled]="saving" *ngIf="isLocked" mat-raised-button disabled class="description-save-btn cursor-default" type="button">{{ 'DMP-OVERVIEW.LOCKED' | translate}}</button>
+									<button [disabled]="saving" *ngIf="hasReversableStatus() && !isLocked" mat-raised-button class="description-save-btn mr-2" (click)="reverse()" type="button">{{ 'DESCRIPTION-EDITOR.ACTIONS.REVERSE' | translate }}</button>
 								</div>
 							</div>
 						</div>
@@ -116,7 +116,7 @@
 							<div>{{'DESCRIPTION-EDITOR.TOC.NEXT' | translate}}</div>
 							<span class="material-icons">chevron_right</span>
 						</div>
-						<button [disabled]="saving" (click)="save(saveAnd.addNew)" *ngIf="(step === maxStep) && isLockedByUser && formGroup.get('descriptionTemplateId').value && !viewOnly" mat-raised-button type="button" class="col-auto stepper-btn add-description-btn ml-auto">
+						<button [disabled]="saving" (click)="save(saveAnd.addNew)" *ngIf="(step === maxStep) && !isLocked && formGroup.get('descriptionTemplateId').value && !viewOnly" mat-raised-button type="button" class="col-auto stepper-btn add-description-btn ml-auto">
 							{{ 'DESCRIPTION-EDITOR.ACTIONS.SAVE-AND-ADD-NEW' | translate }}
 						</button>
 					</div>
diff --git a/dmp-frontend/src/common/base/base-editor.ts b/dmp-frontend/src/common/base/base-editor.ts
index af4b6d933..60ea6f7be 100644
--- a/dmp-frontend/src/common/base/base-editor.ts
+++ b/dmp-frontend/src/common/base/base-editor.ts
@@ -186,14 +186,12 @@ export abstract class BaseEditor<EditorModelType extends BaseEditorModel, Entity
 							message: this.language.instant(message)
 						}, maxWidth: '30em'
 					});
-				} else{
-					this.isLockedByUser = true;
 				}
 
 				if (!this.isLocked && !isNullOrUndefined(this.authService.currentAccountIsAuthenticated())) {
 					// lock it.
 					this.lockService.lock(itemId, targetType).pipe(takeUntil(this._destroyed)).subscribe(async result => {
-						this.isLocked = true;
+						this.isLockedByUser = true;
 						interval(this.configurationService.lockInterval).pipe(takeUntil(this._destroyed)).subscribe(() => this.touchLock(itemId));
 					});
 				}
@@ -211,6 +209,6 @@ export abstract class BaseEditor<EditorModelType extends BaseEditorModel, Entity
 
 	ngOnDestroy(): void {
 		super.ngOnDestroy();
-		if(this.isLocked) this.unlockTarget(this.editorModel.id);
+		if(this.isLockedByUser) this.unlockTarget(this.editorModel.id);
 	}
 }

From 0d9f6ec3c475789e338b4c58c8cd696a763bf4a3 Mon Sep 17 00:00:00 2001
From: Sofia Papacharalampous <spapacharalampous@cite.gr>
Date: Fri, 22 Mar 2024 11:48:54 +0200
Subject: [PATCH 3/5] styling changes

*dmp-description
---
 .../dmp-blueprint-editor.component.html       | 147 +++++++++++-------
 .../dmp-blueprint-editor.component.scss       |  24 +--
 2 files changed, 90 insertions(+), 81 deletions(-)

diff --git a/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.html b/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.html
index 90bd7d6f8..0b890f004 100644
--- a/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.html
+++ b/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.html
@@ -92,7 +92,7 @@
 											</div>
 											<div class="row">
 												<div cdkDropList class="col-12 mt-3" (cdkDropListDropped)="dropFields($event, sectionIndex)">
-													<div *ngFor="let field of section.get('fields').controls; let fieldIndex=index;" cdkDrag class="section-fields-wrapper row" [cdkDragDisabled]="formGroup.disabled" (mouseenter)="onSectionHover(fieldIndex)" (mouseleave)="clearHoveredSection()">
+													<div *ngFor="let field of section.get('fields').controls; let fieldIndex=index;" cdkDrag class="section-fields-wrapper row align-items-center mt-1" [cdkDragDisabled]="formGroup.disabled" (mouseenter)="onSectionHover(fieldIndex)" (mouseleave)="clearHoveredSection()">
 															<div class="col-auto section-options-vertical">
 																<div class="row justify-content-center">
 																	<div class="col-auto">
@@ -106,14 +106,14 @@
 																	</div>
 																</div>
 															</div>
-															<div class="col-auto pr-0 section-field section-options-horizontal">
+															<div class="col-auto pr-0 section-options-horizontal">
 																	<span *ngIf="!isSectionSelected(fieldIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.45rem;">{{fieldIndex + 1}}</span>
 																	<mat-icon *ngIf="isSectionSelected(fieldIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
 															</div>
 															<div class="col">
 																<div class="row">
 																	
-																	<div class="col-4 section-field">
+																	<div class="col-12 col-xl-4">
 																		<mat-form-field class="mt-3 w-100">
 																			<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.CATEGORY' | translate}}</mat-label>
 																			<mat-select [formControl]="field.get('category')" [disabled]="field.disabled" (selectionChange)="fieldCategoryChanged(sectionIndex, fieldIndex)">
@@ -123,7 +123,7 @@
 																			<mat-error *ngIf="field.get('category').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
 																		</mat-form-field>
 																	</div>
-																	<div class="col-4 section-field" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.System">
+																	<div class="col-12 col-xl-4" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.System">
 																		<mat-form-field class="mt-3 w-100">
 																			<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SYSTEM-FIELD-TYPE' | translate}}</mat-label>
 																			<mat-select [formControl]="field.get('systemFieldType')" [disabled]="field.disabled">
@@ -133,7 +133,7 @@
 																			<mat-error *ngIf="field.get('systemFieldType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
 																		</mat-form-field>
 																	</div>
-																	<div class="col-4 section-field" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.Extra">
+																	<div class="col-12 col-xl-4" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.Extra">
 																		<mat-form-field class="mt-3 w-100">
 																			<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label>
 																			<mat-select [formControl]="field.get('dataType')">
@@ -145,7 +145,7 @@
 																			<mat-error *ngIf="field.get('dataType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
 																		</mat-form-field>
 																	</div>
-																	<div class="col-4 section-field" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.ReferenceType">
+																	<div class="col-12 col-xl-4" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.ReferenceType">
 																		<mat-form-field class="mt-3 w-100">
 																			<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.REFERENCE-TYPE' | translate}}</mat-label>
 																			<app-single-auto-complete placeholder="{{'DMP-BLUEPRINT-EDITOR.FIELDS.REFERENCE-TYPE' | translate}}" [required]="true" [formControl]="field.get('referenceTypeId')" [configuration]="referenceTypeService.singleAutocompleteConfiguration"></app-single-auto-complete>
@@ -153,7 +153,7 @@
 																			<mat-error *ngIf="field.get('referenceTypeId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
 																		</mat-form-field>
 																	</div>
-																	<div class="col-4 section-field" *ngIf="field.get('category').value != null">
+																	<div class="col-12 col-xl-4" *ngIf="field.get('category').value != null">
 																		<mat-form-field class="mt-3 w-100">
 																			<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-LABEL' | translate}}</mat-label>
 																			<input matInput type="text" name="label" [formControl]="field.get('label')">
@@ -161,7 +161,7 @@
 																			<mat-error *ngIf="field.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
 																		</mat-form-field>
 																	</div>
-																	<div class="col-4 section-field" *ngIf="field.get('category').value != null">
+																	<div class="col-12 col-xl-4" *ngIf="field.get('category').value != null">
 																		<mat-form-field class="mt-3 w-100">
 																			<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-PLACEHOLDER' | translate}}</mat-label>
 																			<input matInput type="text" name="placeholder" [formControl]="field.get('placeholder')">
@@ -169,7 +169,7 @@
 																			<mat-error *ngIf="field.get('placeholder').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
 																		</mat-form-field>
 																	</div>
-																	<div class="col-4 auto section-field" *ngIf="field.get('category').value != null">
+																	<div class="col-12 col-xl-4" *ngIf="field.get('category').value != null">
 																		<mat-form-field class="mt-3 w-100">
 																			<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-DESCRIPTION' | translate}}</mat-label>
 																			<input matInput type="text" name="description" [formControl]="field.get('description')">
@@ -177,7 +177,7 @@
 																			<mat-error *ngIf="field.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
 																		</mat-form-field>
 																	</div>
-																	<div class="col-4 section-field" *ngIf="field.get('category').value != null">
+																	<div class="col-12 col-xl-4" *ngIf="field.get('category').value != null">
 																		<mat-form-field class="mt-3 w-100">
 																			<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SEMANTICS' | translate}}</mat-label>
 																			<app-multiple-auto-complete placeholder="{{'DMP-BLUEPRINT-EDITOR.FIELDS.SEMANTICS' | translate}}" [hidePlaceholder]="true" [required]="false" [separatorKeysCodes]="separatorKeysCodes" [formControl]="field.get('semantics')" [configuration]="semanticsService.multipleAutocompleteConfiguration">
@@ -188,14 +188,14 @@
 																	</div>
 																</div>
 															</div>
-															<div class="col-auto">
+															<div class="col-12 col-xl-auto">
 																<div class="row">
 																	<div class="col-auto section-field" *ngIf="field.get('category').value != null">
 																		<mat-checkbox [disabled]="field.get('systemFieldType')?.value === dmpBlueprintSystemFieldType.Title || field.get('systemFieldType')?.value === dmpBlueprintSystemFieldType.Description" [formControl]="field.get('required')"><span>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-REQUIRED' | translate}}</span></mat-checkbox>
 																		<mat-error *ngIf="field.get('required').hasError('backendError')">{{field.get('required').getError('backendError').message}}</mat-error>
 																		<mat-error *ngIf="field.get('required').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
 																	</div>
-																	<div [hidden]="viewOnly" class="col-auto section-field section-options-horizontal">
+																	<div [hidden]="viewOnly" class="col-auto section-options-horizontal">
 																		<button mat-icon-button matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(sectionIndex, fieldIndex)" [disabled]="formGroup.disabled">
 																			<mat-icon>delete</mat-icon>
 																		</button>
@@ -225,62 +225,93 @@
 												</div>
 											</div>
 
-											<div cdkDropList class="col-12" (cdkDropListDropped)="dropDescriptionTemplates($event, sectionIndex)">
-												<div *ngFor="let descriptionTemplate of section.get('descriptionTemplates').controls; let descriptionTemplateIndex=index;" cdkDrag class="row align-items-center" [cdkDragDisabled]="formGroup.disabled">
-													<div class="description-fields-wrapper">
-														<div class="description-field-index">
+											<div class="row">
+												<div cdkDropList class="col-12 mt-3" (cdkDropListDropped)="dropDescriptionTemplates($event, sectionIndex)">
+													<div *ngFor="let descriptionTemplate of section.get('descriptionTemplates').controls; let descriptionTemplateIndex=index;" cdkDrag class="description-fields-wrapper row align-items-center mt-1" [cdkDragDisabled]="formGroup.disabled">
+
+														<!-- <div class="description-field-index">
 															<span style="font-size: 18px;">{{descriptionTemplateIndex + 1}}</span>
 														</div>
 														<div class="description-field-sortable"><mat-icon [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon></div>
-														<div class="description-field-template">
-															<mat-form-field class="w-100">
-																<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE' | translate}}</mat-label>
-																<app-single-auto-complete [formControl]="descriptionTemplate.get('descriptionTemplateGroupId')" [hidePlaceholder]="true" [configuration]="descriptionTempalteGroupSingleAutocompleteConfiguration" (optionActionClicked)="onPreviewDescriptionTemplate($event, i)"></app-single-auto-complete>
-																<mat-error *ngIf="descriptionTemplate.get('descriptionTemplateGroupId').hasError('backendError')">{{descriptionTemplate.get('descriptionTemplateGroupId').getError('backendError').message}}</mat-error>
-																<mat-error *ngIf="descriptionTemplate.get('descriptionTemplateGroupId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
-															</mat-form-field>
+															-->
+														<div class="col-auto section-options-vertical">
+															<div class="row justify-content-center">
+																<div class="col-auto">
+																	<span *ngIf="!isSectionSelected(fieldIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.42rem 0 0.45rem;">{{descriptionTemplateIndex + 1}}</span>
+																	<mat-icon *ngIf="isSectionSelected(fieldIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle" style="margin-top: 0.9rem;">drag_indicator</mat-icon>
+																</div>
+																<div class="col-auto">
+																	<button mat-icon-button class="action-list-icon" matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-DESCRIPTION-TEMPLATE' | translate}}" (click)="removeDescriptionTemplate(sectionIndex, descriptionTemplateIndex)" [disabled]="formGroup.disabled">
+																		<mat-icon>delete</mat-icon>
+																	</button>
+																</div>
+															</div>
 														</div>
-														<div class="description-field-template-label">
-															<mat-form-field class="w-100">
-																<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE-LABEL' | translate}}</mat-label>
-																<input matInput type="text" name="label" [formControl]="descriptionTemplate.get('label')">
-																<mat-error *ngIf="descriptionTemplate.get('label').hasError('backendError')">{{descriptionTemplate.get('label').getError('backendError').message}}</mat-error>
-																<mat-error *ngIf="descriptionTemplate.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
-															</mat-form-field>
-														</div>
-														<div class="description-field-template-min-multiplicity">
-															<mat-form-field class="w-100">
-																<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE-MIN-MULTIPLICITY' | translate}}</mat-label>
-																<input matInput type="number" min="0" name="minMultiplicity" [formControl]="descriptionTemplate.get('minMultiplicity')">
-																<mat-error *ngIf="descriptionTemplate.get('minMultiplicity').hasError('backendError')">{{descriptionTemplate.get('minMultiplicity').getError('backendError').message}}</mat-error>
-																<mat-error *ngIf="descriptionTemplate.get('minMultiplicity').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
-															</mat-form-field>
-														</div>
-														<div class="description-field-template-max-multiplicity">
-															<mat-form-field class="w-100">
-																<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE-MAX-MULTIPLICITY' | translate}}</mat-label>
-																<input matInput type="number" min="1" name="maxMultiplicity" [formControl]="descriptionTemplate.get('maxMultiplicity')">
-																<mat-error *ngIf="descriptionTemplate.get('maxMultiplicity').hasError('backendError')">{{descriptionTemplate.get('maxMultiplicity').getError('backendError').message}}</mat-error>
-																<mat-error *ngIf="descriptionTemplate.get('maxMultiplicity').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
-															</mat-form-field>
-														</div>
-														<div class="description-field-delete">
-															<button mat-icon-button class="action-list-icon" matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-DESCRIPTION-TEMPLATE' | translate}}" (click)="removeDescriptionTemplate(sectionIndex, descriptionTemplateIndex)" [disabled]="formGroup.disabled">
-																<mat-icon>delete</mat-icon>
-															</button>
+														<div class="col-auto pr-0 section-options-horizontal">
+																<span *ngIf="!isSectionSelected(fieldIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.45rem;">{{descriptionTemplateIndex + 1}}</span>
+																<mat-icon *ngIf="isSectionSelected(fieldIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
+														</div>	
+														
+														<div class="col">
+															<div class="row">
+																<div class="col-12 col-lg-6 col-xl-3">
+																	<mat-form-field class="w-100">
+																		<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE' | translate}}</mat-label>
+																		<app-single-auto-complete [formControl]="descriptionTemplate.get('descriptionTemplateGroupId')" [hidePlaceholder]="true" [configuration]="descriptionTempalteGroupSingleAutocompleteConfiguration" (optionActionClicked)="onPreviewDescriptionTemplate($event, i)"></app-single-auto-complete>
+																		<mat-error *ngIf="descriptionTemplate.get('descriptionTemplateGroupId').hasError('backendError')">{{descriptionTemplate.get('descriptionTemplateGroupId').getError('backendError').message}}</mat-error>
+																		<mat-error *ngIf="descriptionTemplate.get('descriptionTemplateGroupId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
+																	</mat-form-field>
+																</div>
+																<div class="col-12 col-lg-6 col-xl-3">
+																	<mat-form-field class="w-100">
+																		<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE-LABEL' | translate}}</mat-label>
+																		<input matInput type="text" name="label" [formControl]="descriptionTemplate.get('label')">
+																		<mat-error *ngIf="descriptionTemplate.get('label').hasError('backendError')">{{descriptionTemplate.get('label').getError('backendError').message}}</mat-error>
+																		<mat-error *ngIf="descriptionTemplate.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
+																	</mat-form-field>
+																</div>
+																<div class="col-12 col-lg-6 col-xl-3">
+																	<mat-form-field class="w-100">
+																		<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE-MIN-MULTIPLICITY' | translate}}</mat-label>
+																		<input matInput type="number" min="0" name="minMultiplicity" [formControl]="descriptionTemplate.get('minMultiplicity')">
+																		<mat-error *ngIf="descriptionTemplate.get('minMultiplicity').hasError('backendError')">{{descriptionTemplate.get('minMultiplicity').getError('backendError').message}}</mat-error>
+																		<mat-error *ngIf="descriptionTemplate.get('minMultiplicity').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
+																	</mat-form-field>
+																</div>
+																<div class="col-12 col-lg-6 col-xl-3">
+																	<mat-form-field class="w-100">
+																		<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DESCRIPTION-TEMPLATE-MAX-MULTIPLICITY' | translate}}</mat-label>
+																		<input matInput type="number" min="1" name="maxMultiplicity" [formControl]="descriptionTemplate.get('maxMultiplicity')">
+																		<mat-error *ngIf="descriptionTemplate.get('maxMultiplicity').hasError('backendError')">{{descriptionTemplate.get('maxMultiplicity').getError('backendError').message}}</mat-error>
+																		<mat-error *ngIf="descriptionTemplate.get('maxMultiplicity').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
+																	</mat-form-field>
+																</div>
+															</div>
 														</div>
+														<div class="col-12 col-xl-auto section-options-horizontal">
+															<div class="row">
+																<div class="col-auto">
+																	<button mat-icon-button class="action-list-icon" matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-DESCRIPTION-TEMPLATE' | translate}}" (click)="removeDescriptionTemplate(sectionIndex, descriptionTemplateIndex)" [disabled]="formGroup.disabled">
+																		<mat-icon>delete</mat-icon>
+																	</button>
+																</div>
+															</div>
+														</div>	
 													</div>
+													<mat-error *ngIf="section.get('descriptionTemplates').hasError('backendError')">{{section.get('descriptionTemplates').getError('backendError').message}}</mat-error>
 												</div>
-												<mat-error *ngIf="section.get('descriptionTemplates').hasError('backendError')">{{section.get('descriptionTemplates').getError('backendError').message}}</mat-error>
 											</div>
-											<div *ngIf="section.get('hasTemplates').value == true">
-												<mat-form-field class="col-6 mt-3">
-													<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.PREFILLING-SOURCES' | translate}}</mat-label>
-													<app-multiple-auto-complete [formControl]="section.get('prefillingSourcesIds')" [configuration]="prefillingSourceService.multipleAutocompleteConfiguration"></app-multiple-auto-complete>
-													<mat-error *ngIf="section.get('prefillingSourcesIds').hasError('backendError')">{{section.get('prefillingSourcesIds').getError('backendError').message}}</mat-error>
-												</mat-form-field>
+											<div class="row">
+												<div *ngIf="section.get('hasTemplates').value == true" class="col-lg-6 col-12">
+													<mat-form-field class="w-100 mt-3">
+														<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.PREFILLING-SOURCES' | translate}}</mat-label>
+														<app-multiple-auto-complete [formControl]="section.get('prefillingSourcesIds')" [configuration]="prefillingSourceService.multipleAutocompleteConfiguration"></app-multiple-auto-complete>
+														<mat-error *ngIf="section.get('prefillingSourcesIds').hasError('backendError')">{{section.get('prefillingSourcesIds').getError('backendError').message}}</mat-error>
+													</mat-form-field>
+												</div>
 											</div>
 
+
 										</mat-card-content>
 
 
diff --git a/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.scss b/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.scss
index c3fcf299d..ebd157447 100644
--- a/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.scss
+++ b/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.scss
@@ -135,12 +135,9 @@
 	}
 }
 
+.description-fields-wrapper,
 .section-fields-wrapper {
 	width: 100%;
-	margin-top: 1.0rem;
-	display: flex;
-	flex-wrap: wrap; // ??
-	align-items: center;
 	
 	.section-options-vertical {
 		display: none;
@@ -159,27 +156,8 @@
 		}
 		
 		.section-options-vertical {
-			width: 100%;
 			display: initial;
 		}
-
-		.section-field {
-			width: 100%;
-			max-width: initial;
-		}
-	}
-}
-
-.description-fields-wrapper {
-	width: 100%;
-	margin-top: 1.0rem;
-	display: flex;
-	flex-wrap: wrap; // ??
-	align-items: center;
-
-	@media (max-width: 1470px) {
-		flex-direction: column;
-		align-items: flex-start;
 	}
 }
 

From aed0f9de8eb740bba04239d3f8c423e7fd96b921 Mon Sep 17 00:00:00 2001
From: Sofia Papacharalampous <spapacharalampous@cite.gr>
Date: Fri, 22 Mar 2024 12:04:43 +0200
Subject: [PATCH 4/5] fixed sortable field

*dmp-blueprint-editor>description-template
---
 .../editor/dmp-blueprint-editor.component.html   | 16 +++++-----------
 .../editor/dmp-blueprint-editor.component.ts     | 13 +++++++++++++
 2 files changed, 18 insertions(+), 11 deletions(-)

diff --git a/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.html b/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.html
index 3c2de4991..f6715e40b 100644
--- a/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.html
+++ b/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.html
@@ -227,18 +227,13 @@
 
 											<div class="row">
 												<div cdkDropList class="col-12 mt-3" (cdkDropListDropped)="dropDescriptionTemplates($event, sectionIndex)">
-													<div *ngFor="let descriptionTemplate of section.get('descriptionTemplates').controls; let descriptionTemplateIndex=index;" cdkDrag class="description-fields-wrapper row align-items-center mt-1" [cdkDragDisabled]="formGroup.disabled">
+													<div *ngFor="let descriptionTemplate of section.get('descriptionTemplates').controls; let descriptionTemplateIndex=index;" cdkDrag class="description-fields-wrapper row align-items-center mt-1" [cdkDragDisabled]="formGroup.disabled" (mouseenter)="onDescriptionTemplateHover(descriptionTemplateIndex)" (mouseleave)="clearHoveredDescriptionTemplate()">
 
-														<!-- <div class="description-field-index">
-															<span style="font-size: 18px;">{{descriptionTemplateIndex + 1}}</span>
-														</div>
-														<div class="description-field-sortable"><mat-icon [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon></div>
-															-->
 														<div class="col-auto section-options-vertical">
 															<div class="row justify-content-center">
 																<div class="col-auto">
-																	<span *ngIf="!isSectionSelected(fieldIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.42rem 0 0.45rem;">{{descriptionTemplateIndex + 1}}</span>
-																	<mat-icon *ngIf="isSectionSelected(fieldIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle" style="margin-top: 0.9rem;">drag_indicator</mat-icon>
+																	<span *ngIf="!isDescriptionTemplateSelected(descriptionTemplateIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.42rem 0 0.45rem;">{{descriptionTemplateIndex + 1}}</span>
+																	<mat-icon *ngIf="isDescriptionTemplateSelected(descriptionTemplateIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle" style="margin-top: 0.9rem;">drag_indicator</mat-icon>
 																</div>
 																<div class="col-auto">
 																	<button mat-icon-button class="action-list-icon" matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-DESCRIPTION-TEMPLATE' | translate}}" (click)="removeDescriptionTemplate(sectionIndex, descriptionTemplateIndex)" [disabled]="formGroup.disabled">
@@ -248,8 +243,8 @@
 															</div>
 														</div>
 														<div class="col-auto pr-0 section-options-horizontal">
-																<span *ngIf="!isSectionSelected(fieldIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.45rem;">{{descriptionTemplateIndex + 1}}</span>
-																<mat-icon *ngIf="isSectionSelected(fieldIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
+																<span *ngIf="!isDescriptionTemplateSelected(descriptionTemplateIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.45rem;">{{descriptionTemplateIndex + 1}}</span>
+																<mat-icon *ngIf="isDescriptionTemplateSelected(descriptionTemplateIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
 														</div>	
 														
 														<div class="col">
@@ -322,7 +317,6 @@
 							</div>
 						</div>
 
-
 						<div class="col-12">
 							<div class="row">
 								<div class="col-auto">
diff --git a/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.ts b/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.ts
index 6e50e95b8..d9ee7ef17 100644
--- a/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.ts
+++ b/dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.ts
@@ -64,6 +64,7 @@ export class DmpBlueprintEditorComponent extends BaseEditor<DmpBlueprintEditorMo
 	showInactiveDetails = false;
 
 	hoveredSectionIndex:number = -1;
+	hoveredDescriptionTemplateIndex:number = -1;
 
 	dmpBlueprintSectionFieldCategory = DmpBlueprintFieldCategory;
 	dmpBlueprintSystemFieldType = DmpBlueprintSystemFieldType;
@@ -395,6 +396,18 @@ export class DmpBlueprintEditorComponent extends BaseEditor<DmpBlueprintEditorMo
 
 	//Description Templates
 
+	isDescriptionTemplateSelected(descriptionTemplateId: number): boolean {
+		return this.hoveredDescriptionTemplateIndex === descriptionTemplateId;
+	}
+
+	onDescriptionTemplateHover(descriptionTemplateId: any): void {
+		this.hoveredDescriptionTemplateIndex = descriptionTemplateId;
+	}
+
+	clearHoveredDescriptionTemplate(): void {
+		this.hoveredDescriptionTemplateIndex = -1;
+	}
+
 	removeAllDescriptionTemplates(matCheckBox: MatCheckboxChange, sectionIndex: number) {
 		if (matCheckBox.checked == false) {
 			const descriptionTemplateSize = ((this.formGroup.get('definition').get('sections') as FormArray).at(sectionIndex).get('descriptionTemplates') as FormArray).length;

From 15cc2d16ca8d495c82ff1e77567d7eb7cd9b3729 Mon Sep 17 00:00:00 2001
From: Diamantis Tziotzios <dtziotzios@cite.gr>
Date: Fri, 22 Mar 2024 13:06:10 +0200
Subject: [PATCH 5/5] small ui fixes

---
 .../field-set-title/field-set-title.component.html   |  4 ++--
 .../form-field-set/form-field-set.component.html     |  6 +++---
 .../overview/description-overview.component.html     |  2 +-
 .../dmp-editor-blueprint/dmp-editor.component.html   |  2 +-
 dmp-frontend/src/assets/i18n/en.json                 | 12 +++++++++---
 5 files changed, 16 insertions(+), 10 deletions(-)

diff --git a/dmp-frontend/src/app/ui/description/editor/description-form/components/form-field-set/field-set-title/field-set-title.component.html b/dmp-frontend/src/app/ui/description/editor/description-form/components/form-field-set/field-set-title/field-set-title.component.html
index bd01cfe40..912cd2d99 100644
--- a/dmp-frontend/src/app/ui/description/editor/description-form/components/form-field-set/field-set-title/field-set-title.component.html
+++ b/dmp-frontend/src/app/ui/description/editor/description-form/components/form-field-set/field-set-title/field-set-title.component.html
@@ -13,12 +13,12 @@
 
 <div *ngIf="fieldSet.extendedDescription  && !isChild" class="col-12 mt-3 mb-3">
 	<div *ngIf="!showExtendedDescription" (click)="showExtendedDescription = !showExtendedDescription">
-		<span class="more d-flex justify-content-center">{{'DATASET-EDITOR.QUESTION.EXTENDED-DESCRIPTION.VIEW-MORE' | translate}}</span>
+		<span class="more d-flex justify-content-center">{{'DESCRIPTION-EDITOR.ACTIONS.VIEW-MORE' | translate}}</span>
 	</div>
 	<div *ngIf="showExtendedDescription">
 		<h6 [innerHTML]="fieldSet.extendedDescription"></h6>
 		<span class="more d-flex justify-content-center" (click)="showExtendedDescription = !showExtendedDescription">
-			{{'DATASET-EDITOR.QUESTION.EXTENDED-DESCRIPTION.VIEW-LESS' | translate}}
+			{{'DESCRIPTION-EDITOR.ACTIONS.VIEW-LESS' | translate}}
 		</span>
 	</div>
 </div>
\ No newline at end of file
diff --git a/dmp-frontend/src/app/ui/description/editor/description-form/components/form-field-set/form-field-set.component.html b/dmp-frontend/src/app/ui/description/editor/description-form/components/form-field-set/form-field-set.component.html
index a81d198b5..e8f96ed06 100644
--- a/dmp-frontend/src/app/ui/description/editor/description-form/components/form-field-set/form-field-set.component.html
+++ b/dmp-frontend/src/app/ui/description/editor/description-form/components/form-field-set/form-field-set.component.html
@@ -37,7 +37,7 @@
 					<mat-icon>add_circle</mat-icon>
 				</button>
 				<span class="mt-1" *ngIf="fieldSet?.multiplicity?.placeholder">{{fieldSet.multiplicity.placeholder}}</span>
-				<span class="mt-1" *ngIf="!fieldSet?.multiplicity?.placeholder">{{('DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.MULTIPLICITY-ADD-ONE-FIELD' + (fieldSet.multiplicity.tableView?'-TABLEVIEW':'')) | translate}}</span>
+				<span class="mt-1" *ngIf="!fieldSet?.multiplicity?.placeholder">{{('DESCRIPTION-EDITOR.ACTIONS.MULTIPLICITY-ADD-ONE-FIELD' + (fieldSet.multiplicity.tableView?'-TABLEVIEW':'')) | translate}}</span>
 			</span>
 		</div>
 	</div>
@@ -65,7 +65,7 @@
 							<mat-icon>add_circle</mat-icon>
 						</button>
 						<span class="mt-1" *ngIf="fieldSet.multiplicity.placeholder">{{fieldSet.multiplicity.placeholder}}</span>
-						<span class="mt-1" *ngIf="!fieldSet.multiplicity.placeholder">{{('DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.MULTIPLICITY-ADD-ONE-FIELD' + (fieldSet.multiplicity.tableView?'-TABLEVIEW':'')) | translate}}</span>
+						<span class="mt-1" *ngIf="!fieldSet.multiplicity.placeholder">{{('DESCRIPTION-EDITOR.ACTIONS.MULTIPLICITY-ADD-ONE-FIELD' + (fieldSet.multiplicity.tableView?'-TABLEVIEW':'')) | translate}}</span>
 					</span>
 				</td>
 			</tr>
@@ -75,6 +75,6 @@
 <!-- comment only on top level fieldset -->
 <div class="row">
 	<div *ngIf="fieldSet.hasCommentField && propertiesFormGroup?.get('items')?.at(0)?.get('comment')" class="col-12">
-		<rich-text-editor-component [form]="propertiesFormGroup?.get('items')?.at(0)?.get('comment')" [id]="'editor1'" [placeholder]="'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-PLACEHOLDER' | translate" [wrapperClasses]="'mb-2'" [editable]="!propertiesFormGroup?.get('items')?.at(0)?.get('comment').disabled"></rich-text-editor-component>
+		<rich-text-editor-component [form]="propertiesFormGroup?.get('items')?.at(0)?.get('comment')" [id]="'editor1'" [placeholder]="'DESCRIPTION-EDITOR.FIELDS.COMMENT-PLACEHOLDER' | translate" [wrapperClasses]="'mb-2'" [editable]="!propertiesFormGroup?.get('items')?.at(0)?.get('comment').disabled"></rich-text-editor-component>
 	</div>
 </div>
\ No newline at end of file
diff --git a/dmp-frontend/src/app/ui/description/overview/description-overview.component.html b/dmp-frontend/src/app/ui/description/overview/description-overview.component.html
index 7be667a40..a0cd183bc 100644
--- a/dmp-frontend/src/app/ui/description/overview/description-overview.component.html
+++ b/dmp-frontend/src/app/ui/description/overview/description-overview.component.html
@@ -12,7 +12,7 @@
 						<p class="col description-label p-0 ml-3 mb-0">{{ description.label }}</p>
 					</div>
 					<div class="row d-flex align-items-center mt-3 mb-4 label-txt">
-						<div *ngIf="canEdit" class="d-flex">
+						<div *ngIf="!isPublicView" class="d-flex">
 							<p class="ml-0 mb-0 label2-txt">
 								{{ enumUtils.toDmpUserRolesString(dmpService.getCurrentUserRolesInDmp(description?.dmp?.dmpUsers)) }}
 							</p>
diff --git a/dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.component.html b/dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.component.html
index 05862add9..fb0859a81 100644
--- a/dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.component.html
+++ b/dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.component.html
@@ -90,7 +90,7 @@
 										<li *ngFor="let description of descriptionsInSection(section.id); let descriptionIndex = index" (click)="editDescription(description.id, false)" class="active-description">
 											<div class="d-flex flex-direction-row">
 												<div class="label" matTooltip="{{description.label}}">{{'DMP-EDITOR.DESCRIPTION' | translate}}: {{ description.label }}</div>
-												<mat-icon *ngIf="description.status !== descriptionStatusEnum.Finalized && canDeleteSection(section.id)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" class="ml-2 mr-2 remove-description size-16" matTooltip="{{'DMP-EDITOR.ACTIONS.DELETE' | translate}}" (click)="$event.stopPropagation(); removeDescription(description.id)">close</mat-icon>
+												<mat-icon *ngIf="description.status !== descriptionStatusEnum.Finalized && canDeleteSection(section.id) && !formGroup.disabled" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" class="ml-2 mr-2 remove-description size-16" matTooltip="{{'DMP-EDITOR.ACTIONS.DELETE' | translate}}" (click)="$event.stopPropagation(); removeDescription(description.id)">close</mat-icon>
 												<mat-icon *ngIf="description.status === descriptionStatusEnum.Finalized" class="ml-2 mr-2 status-icon check-icon size-16" matTooltip="{{'TYPES.DESCRIPTION-STATUS.FINALISED' | translate}}">check</mat-icon>
 											</div>
 										</li>
diff --git a/dmp-frontend/src/assets/i18n/en.json b/dmp-frontend/src/assets/i18n/en.json
index 168636ec9..05c32f3af 100644
--- a/dmp-frontend/src/assets/i18n/en.json
+++ b/dmp-frontend/src/assets/i18n/en.json
@@ -383,7 +383,6 @@
 						"MULTIPLICITY-ADD-ONE-FIELD": "Add more",
 						"MULTIPLICITY-ADD-ONE-FIELD-TABLEVIEW": "Add row",
 						"ORDER": "Order",
-						"COMMENT-PLACEHOLDER": "Please Specify",
 						"COMMENT-HINT": "Provide additional information or justification about your selection",
 						"SEMANTICS": "Semantics",
 						"EXPORT": "Include in Export"
@@ -859,6 +858,9 @@
 				"DESCRIPTION-TEMPLATE-VERSION": "Version"
 			}
 		},
+		"FIELDS": {
+			"COMMENT-PLACEHOLDER": "Please Specify"
+		},
 		"ACTIONS": {
 			"BACK-TO": "Back to",
 			"EXPORT": "Export",
@@ -871,9 +873,13 @@
 			"REVERSE": "Undo Finalization",
 			"UNDO-FINALIZATION-QUESTION": "Undo finalization?",
 			"CONFIRM": "Yes",
-			"REJECT": "No"
+			"REJECT": "No",
+			"MULTIPLICITY-ADD-ONE-FIELD": "Add more",
+			"MULTIPLICITY-ADD-ONE-FIELD-TABLEVIEW": "Add row",
+			"VIEW-MORE": "View more",
+			"VIEW-LESS": "View less"
 		},
-		"MESSAGES":{
+		"MESSAGES": {
 			"MISSING-FIELDS": "There are some required fields left unfilled. Please check the Plan and make sure that all required questions are answered and URLs are provided with valid input. (Missing fields are marked in red color)"
 		},
 		"LOCKED-DIALOG": {