From e17e9f03aedf4827b123e0d613fb94a0699d8ed2 Mon Sep 17 00:00:00 2001
From: rhenck <richard.henck@iqb.hu-berlin.de>
Date: Wed, 15 May 2024 21:11:23 +0200
Subject: [PATCH] [editor-ui] More textareas
Use textareas in several places where longer text is expected/common.
#637
---
.../element-model-properties.component.html | 13 +++++++++----
.../input-element-properties.component.ts | 6 ++++--
.../properties-panel/option-list-panel.component.ts | 4 ++--
3 files changed, 15 insertions(+), 8 deletions(-)
diff --git a/projects/editor/src/app/components/properties-panel/model-properties-tab/element-model-properties.component.html b/projects/editor/src/app/components/properties-panel/model-properties-tab/element-model-properties.component.html
index 3ade4a32a..394131d14 100644
--- a/projects/editor/src/app/components/properties-panel/model-properties-tab/element-model-properties.component.html
+++ b/projects/editor/src/app/components/properties-panel/model-properties-tab/element-model-properties.component.html
@@ -18,14 +18,19 @@
<mat-form-field *ngIf="combinedProperties.label !== undefined && combinedProperties.required === undefined"
appearance="fill">
<mat-label>{{'propertiesPanel.label' | translate }}</mat-label>
- <input matInput type="text" [value]="$any(combinedProperties.label)"
- (input)="updateModel.emit({property: 'label', value: $any($event.target).value })">
+ <textarea matInput type="text"
+ [value]="$any(combinedProperties.label)"
+ (input)="updateModel.emit({property: 'label', value: $any($event.target).value })">
+ </textarea>
+
</mat-form-field>
<mat-form-field *ngIf="combinedProperties.label2 !== undefined" appearance="fill">
<mat-label>{{'propertiesPanel.label2' | translate }}</mat-label>
- <input matInput type="text" [value]="$any(combinedProperties.label2)"
- (input)="updateModel.emit({property: 'label2', value: $any($event.target).value })">
+ <textarea matInput type="text"
+ [value]="$any(combinedProperties.label2)"
+ (input)="updateModel.emit({property: 'label2', value: $any($event.target).value })">
+ </textarea>
</mat-form-field>
<aspect-options-field-set [combinedProperties]="combinedProperties"
diff --git a/projects/editor/src/app/components/properties-panel/model-properties-tab/input-groups/input-element-properties.component.ts b/projects/editor/src/app/components/properties-panel/model-properties-tab/input-groups/input-element-properties.component.ts
index 193919b9f..e2c37ca74 100644
--- a/projects/editor/src/app/components/properties-panel/model-properties-tab/input-groups/input-element-properties.component.ts
+++ b/projects/editor/src/app/components/properties-panel/model-properties-tab/input-groups/input-element-properties.component.ts
@@ -10,8 +10,10 @@ import { UIElement } from 'common/models/elements/element';
<legend>Eingabeelement</legend>
<mat-form-field *ngIf="combinedProperties.label !== undefined" appearance="fill">
<mat-label>{{'propertiesPanel.label' | translate }}</mat-label>
- <input matInput type="text" [value]="$any(combinedProperties.label)"
- (input)="updateModel.emit({property: 'label', value: $any($event.target).value })">
+ <textarea matInput type="text"
+ [value]="$any(combinedProperties.label)"
+ (input)="updateModel.emit({ property: 'label', value: $any($event.target).value })">
+ </textarea>
</mat-form-field>
<mat-checkbox *ngIf="combinedProperties.readOnly !== undefined"
diff --git a/projects/editor/src/app/components/properties-panel/option-list-panel.component.ts b/projects/editor/src/app/components/properties-panel/option-list-panel.component.ts
index fce433175..7e2447491 100644
--- a/projects/editor/src/app/components/properties-panel/option-list-panel.component.ts
+++ b/projects/editor/src/app/components/properties-panel/option-list-panel.component.ts
@@ -13,8 +13,8 @@ import { Label } from 'common/models/elements/label-interfaces';
<legend>{{title | translate }}</legend>
<mat-form-field appearance="outline">
<mat-label>{{textFieldLabel}}</mat-label>
- <input #newItem matInput type="text" placeholder="Fragetext"
- (keyup.enter)="addListItem(newItem.value); newItem.select()">
+ <textarea #newItem matInput cdkTextareaAutosize type="text"
+ (keyup.enter)="addListItem(newItem.value); newItem.select()"></textarea>
<button mat-icon-button matSuffix color="primary"
(click)="addListItem(newItem.value); newItem.select()">
<mat-icon>add</mat-icon>
--
GitLab