From 38deeeb0c565f828dcb1cbdc52781945e1aceaf8 Mon Sep 17 00:00:00 2001
From: rhenck <richard.henck@iqb.hu-berlin.de>
Date: Fri, 5 Nov 2021 12:51:15 +0100
Subject: [PATCH] [editor] Fix style property inputs when value is set to empty
string
The whole panel tab was not correctly checking for value existence. Need
to check for undefined not null.
---
.../element-style-properties.component.ts | 18 +++++++++---------
1 file changed, 9 insertions(+), 9 deletions(-)
diff --git a/projects/editor/src/app/unit-view/page-view/properties-panel/element-style-properties.component.ts b/projects/editor/src/app/unit-view/page-view/properties-panel/element-style-properties.component.ts
index eb6646196..aaff4480c 100644
--- a/projects/editor/src/app/unit-view/page-view/properties-panel/element-style-properties.component.ts
+++ b/projects/editor/src/app/unit-view/page-view/properties-panel/element-style-properties.component.ts
@@ -7,31 +7,31 @@ import { UIElement } from '../../../../../../common/models/uI-element';
selector: 'app-element-style-properties',
template: `
<div fxLayout="column">
- <mat-form-field *ngIf="combinedProperties.backgroundColor"
+ <mat-form-field *ngIf="combinedProperties.backgroundColor !== undefined"
appearance="fill" class="mdInput textsingleline">
<mat-label>{{'propertiesPanel.backgroundColor' | translate }}</mat-label>
<input matInput type="color" [value]="combinedProperties.backgroundColor"
(input)="updateModel.emit({ property: 'backgroundColor', value: $any($event.target).value })">
</mat-form-field>
- <mat-form-field *ngIf="combinedProperties.backgroundColor"
+ <mat-form-field *ngIf="combinedProperties.backgroundColor !== undefined"
appearance="fill" class="mdInput textsingleline">
<mat-label>{{'propertiesPanel.backgroundColor' | translate }}</mat-label>
<input matInput type="text" [value]="combinedProperties.backgroundColor"
(input)="updateModel.emit({ property: 'backgroundColor', value: $any($event.target).value })">
</mat-form-field>
- <mat-form-field *ngIf="combinedProperties.fontColor"
+ <mat-form-field *ngIf="combinedProperties.fontColor !== undefined"
appearance="fill" class="mdInput textsingleline">
<mat-label>{{'propertiesPanel.fontColor' | translate }}</mat-label>
<input matInput type="color" [value]="combinedProperties.fontColor"
(input)="updateModel.emit({ property: 'fontColor', value: $any($event.target).value })">
</mat-form-field>
- <mat-form-field *ngIf="combinedProperties.font != null"
+ <mat-form-field *ngIf="combinedProperties.font !== undefined"
appearance="fill" class="mdInput textsingleline">
<mat-label>{{'propertiesPanel.font' | translate }}</mat-label>
<input matInput type="text" [value]="combinedProperties.font"
(input)="updateModel.emit({ property: 'font', value: $any($event.target).value })">
</mat-form-field>
- <mat-form-field *ngIf="combinedProperties.fontSize != null"
+ <mat-form-field *ngIf="combinedProperties.fontSize !== undefined"
appearance="fill" class="mdInput textsingleline">
<mat-label>{{'propertiesPanel.fontSize' | translate }}</mat-label>
<input matInput type="number" #fontSize="ngModel" min="0"
@@ -40,7 +40,7 @@ import { UIElement } from '../../../../../../common/models/uI-element';
value: $event,
isInputValid: fontSize.valid && $event !== null})">
</mat-form-field>
- <mat-form-field *ngIf="combinedProperties.lineHeight != null"
+ <mat-form-field *ngIf="combinedProperties.lineHeight !== undefined"
appearance="fill" class="mdInput textsingleline">
<mat-label>{{'propertiesPanel.lineHeight' | translate }}</mat-label>
<input matInput type="number" #lineHeight="ngModel" min="0"
@@ -50,17 +50,17 @@ import { UIElement } from '../../../../../../common/models/uI-element';
isInputValid: lineHeight.valid && $event !== null })">
</mat-form-field>
- <mat-checkbox *ngIf="combinedProperties.bold != null"
+ <mat-checkbox *ngIf="combinedProperties.bold !== undefined"
[checked]="$any(combinedProperties.bold)"
(change)="updateModel.emit({ property: 'bold', value: $event.checked })">
{{'propertiesPanel.bold' | translate }}
</mat-checkbox>
- <mat-checkbox *ngIf="combinedProperties.italic != null"
+ <mat-checkbox *ngIf="combinedProperties.italic !== undefined"
[checked]="$any(combinedProperties.italic)"
(change)="updateModel.emit({ property: 'italic', value: $event.checked })">
{{'propertiesPanel.italic' | translate }}
</mat-checkbox>
- <mat-checkbox *ngIf="combinedProperties.underline != null"
+ <mat-checkbox *ngIf="combinedProperties.underline !== undefined"
[checked]="$any(combinedProperties.underline)"
(change)="updateModel.emit({ property: 'underline', value: $event.checked })">
{{'propertiesPanel.underline' | translate }}
--
GitLab