diff --git a/projects/common/element-components/checkbox.component.ts b/projects/common/element-components/checkbox.component.ts index 1c0b32fa913c745f09702a1956646d155f2cf052..dd417ab5f4af395019ac46cd4128c39a4f48ba53 100644 --- a/projects/common/element-components/checkbox.component.ts +++ b/projects/common/element-components/checkbox.component.ts @@ -6,12 +6,12 @@ import { FormElementComponent } from '../form-element-component.directive'; @Component({ selector: 'app-checkbox', template: ` - <div class="mat-form-field"> + <div class="mat-form-field" + [style.width.%]="100" + [style.height.%]="100" + [style.background-color]="elementModel.backgroundColor"> <mat-checkbox #checkbox class="example-margin" [formControl]="elementFormControl" - [style.width.%]="100" - [style.height.%]="100" - [style.background-color]="elementModel.backgroundColor" [style.color]="elementModel.fontColor" [style.font-family]="elementModel.font" [style.font-size.px]="elementModel.fontSize" @@ -21,6 +21,9 @@ import { FormElementComponent } from '../form-element-component.directive'; <div [innerHTML]="elementModel.label"></div> </mat-checkbox> <mat-error *ngIf="elementFormControl.errors && elementFormControl.touched" + [style.margin-top.px]="5" + [style.position]="'absolute'" + [style.display]="'block'" [style.font-size.%]="75"> {{elementFormControl.errors | errorTransform: elementModel}} </mat-error> diff --git a/projects/common/element-components/radio-button-group.component.ts b/projects/common/element-components/radio-button-group.component.ts index ca91b333c793669299866aaeddd9c26831c7b281..335a77570cc9896a5724f769f5fd64c8bcc4d249 100644 --- a/projects/common/element-components/radio-button-group.component.ts +++ b/projects/common/element-components/radio-button-group.component.ts @@ -5,7 +5,7 @@ import { FormElementComponent } from '../form-element-component.directive'; @Component({ selector: 'app-radio-button-group', template: ` - <div class="mat-form-field" + <div class="mmatd" [style.width.%]="100" [style.height.%]="100" [style.background-color]="elementModel.backgroundColor" @@ -17,14 +17,16 @@ import { FormElementComponent } from '../form-element-component.directive'; [style.text-decoration]="elementModel.underline ? 'underline' : ''"> <label [innerHTML]="elementModel.label" id="radio-group-label"></label> <mat-radio-group aria-labelledby="radio-group-label" - [style.margin-bottom.px]="20" + [style.margin-bottom.px]="25" [fxLayout]="elementModel.alignment" [formControl]="elementFormControl"> <mat-radio-button *ngFor="let option of elementModel.options" [value]="option"> {{option}} </mat-radio-button> <mat-error *ngIf="elementFormControl.errors && elementFormControl.touched" - [style.font-size.%]="75"> + [style.font-size.%]="75" + [style.margin-top.px]="25" + [style.position]="'absolute'"> {{elementFormControl.errors | errorTransform: elementModel}} </mat-error> </mat-radio-group> diff --git a/projects/editor/src/app/UnitFactory.ts b/projects/editor/src/app/UnitFactory.ts index e3ef2806cb58bda9e40f1dec2703df5953fb3489..e5df2ab2fc9048f80cab07dd91d7127e364d43af 100644 --- a/projects/editor/src/app/UnitFactory.ts +++ b/projects/editor/src/app/UnitFactory.ts @@ -176,7 +176,7 @@ export function createRadioButtonGroupElement(): RadioButtonGroupElement { ...createInputUIElement('Beschriftung Optionsfeld', undefined), ...createTextUIElement(), ...createSurfaceUIElement(), - height: 75, + height: 85, backgroundColor: 'transparent' }; }