From cc1b021f20eaeaeaabc6b3ffd0ddbf159a0aa0d5 Mon Sep 17 00:00:00 2001
From: jojohoch <joachim.hoch@iqb.hu-berlin.de>
Date: Thu, 16 Dec 2021 10:19:45 +0100
Subject: [PATCH] Use fixed size property for text-field component
---
docs/release-notes-player.txt | 2 +-
.../common/ui-elements/text-field/text-field.component.ts | 7 +++++--
2 files changed, 6 insertions(+), 3 deletions(-)
diff --git a/docs/release-notes-player.txt b/docs/release-notes-player.txt
index 533a67299..b7be4c348 100644
--- a/docs/release-notes-player.txt
+++ b/docs/release-notes-player.txt
@@ -1,7 +1,7 @@
Player
======
1.12.0
-- Use fixed size property button and drop-list components
+- Use fixed size property dynamic button, drop-list and text-field components
- Prevent scrollbars for static buttons with images
- Fix the playability of dependent audios and videos
- Fix storing/restoring of the playback time of audios and videos
diff --git a/projects/common/ui-elements/text-field/text-field.component.ts b/projects/common/ui-elements/text-field/text-field.component.ts
index 6dc465ada..34a22e16f 100644
--- a/projects/common/ui-elements/text-field/text-field.component.ts
+++ b/projects/common/ui-elements/text-field/text-field.component.ts
@@ -9,8 +9,10 @@ import { TextFieldElement } from './text-field-element';
selector: 'app-text-field',
template: `
<mat-form-field *ngIf="elementModel.label !== ''"
- [style.width.%]="100"
- [style.height.%]="100"
+ [class.center-content]="elementModel.positionProps.dynamicPositioning &&
+ elementModel.positionProps.fixedSize"
+ [style.width]="elementModel.positionProps.fixedSize ? elementModel.width + 'px' : '100%'"
+ [style.height]="elementModel.positionProps.fixedSize ? elementModel.height + 'px' : '100%'"
[style.color]="elementModel.fontProps.fontColor"
[style.font-family]="elementModel.fontProps.font"
[style.font-size.px]="elementModel.fontProps.fontSize"
@@ -67,6 +69,7 @@ import { TextFieldElement } from './text-field-element';
</mat-form-field>
`,
styles: [
+ '.center-content {display: block; margin: auto; top: 50%; transform: translateY(-50%);}',
'::ng-deep app-text-field .small-input div.mat-form-field-infix {border-top: none; padding: 0.55em 0 0.25em 0;}' // TODO
]
})
--
GitLab