[player] Show `requiredTrue` messages for checkboxes

projects/player/src/app/components/element-overlay/element-overlay.component.css

 .dynamic-validation-messages{
+  position: relative;
   display: block;
   margin-top: -20px;
 }

projects/player/src/app/components/validation-message/validation-message.component.html

 <ng-container *ngIf="formElementControl && formElementControl.touched">
-  <mat-error *ngIf="formElementControl.errors?.required"
+  <mat-error *ngIf="formElementControl.errors?.required && elementModel.type !== 'checkbox'"
              [ngClass]="elementModel.dynamicPositioning ? 'dynamic-validation-message' : ''" >
     {{requiredMessage}}
   </mat-error>
-  <mat-error *ngIf="formElementControl.errors?.requiredTrue"
+  <mat-error *ngIf="formElementControl.errors?.required && elementModel.type === 'checkbox'"
              [ngClass]="elementModel.dynamicPositioning ? 'dynamic-validation-message' : ''" >
-    {{requiredMessage}}
+    {{requiredTrueMessage}}
   </mat-error>
   <mat-error *ngIf="formElementControl.errors?.minlength"
              [ngClass]="elementModel.dynamicPositioning ? 'dynamic-validation-message' : ''" >

projects/player/src/app/components/validation-message/validation-message.component.ts

@@ -4,6 +4,7 @@ import {
 } from '@angular/forms';
 import { TranslateService } from '@ngx-translate/core';
 import {
+  CheckboxElement,
   InputUIElement, NumberFieldElement, TextFieldElement, UnitUIElement
 } from '../../../../../common/unit';
 import { FormService } from '../../../../../common/form.service';
@@ -19,6 +20,7 @@ export class ValidationMessageComponent implements OnInit {
   @Input() parentForm!: FormGroup;
   formElementControl!: FormControl;
   requiredMessage!: string;
+  requiredTrueMessage!: string;
   minLengthMessage!: string;
   maxLengthMessage!: string;
   minMessage!: string;
@@ -66,6 +68,9 @@ export class ValidationMessageComponent implements OnInit {
     this.requiredMessage = (this.elementModel as InputUIElement).requiredWarnMessage ||
       this.translateService.instant('validators.inputRequired');
 
+    this.requiredTrueMessage = (this.elementModel as CheckboxElement).requiredWarnMessage ||
+      this.translateService.instant('validators.inputRequiredTrue');
+
     this.minLengthMessage = (this.elementModel as TextFieldElement).minWarnMessage ||
       this.translateService.instant('validators.inputTooShort');
 

projects/player/src/assets/i18n/de.json

@@ -5,6 +5,7 @@
   "noReason": "Navigation ohne Angabe von Gründen verweigert",
   "validators": {
     "inputRequired": "Eingabe erforderlich",
+    "inputRequiredTrue": "Ankreuzen erforderlich",
     "InputTooShort": "Eingabe zu kurz",
     "InputTooLong": "Eingabe zu lang",
     "ValueTooSmall": "Wert zu klein",