[player] Fix unnecessary scrollbars for image, button, and textarea

projects/common/element-components/button.component.ts

@@ -5,23 +5,28 @@ import { ButtonElement } from '../models/button-element';
 @Component({
   selector: 'app-button',
   template: `
-    <button *ngIf="!elementModel.imageSrc" mat-button
-            (focusin)="onFocusin.emit()"
-            [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"
-            [style.font-weight]="elementModel.bold ? 'bold' : ''"
-            [style.font-style]="elementModel.italic ? 'italic' : ''"
-            [style.text-decoration]="elementModel.underline ? 'underline' : ''"
-            [style.border-radius.px]="elementModel.borderRadius">
-      {{elementModel.label}}
-    </button>
-    <input *ngIf="elementModel.imageSrc" type="image" [src]="elementModel.imageSrc"
-           [width]="elementModel.width" [height]="elementModel.height"
-           [style.object-fit]="'scale-down'" alt="Bild nicht gefunden">
+    <div [style.display]="'flex'"
+         [style.width.%]="100"
+         [style.height.%]="100">
+      <button *ngIf="!elementModel.imageSrc" mat-button
+              (focusin)="onFocusin.emit()"
+              [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"
+              [style.font-weight]="elementModel.bold ? 'bold' : ''"
+              [style.font-style]="elementModel.italic ? 'italic' : ''"
+              [style.text-decoration]="elementModel.underline ? 'underline' : ''"
+              [style.border-radius.px]="elementModel.borderRadius">
+        {{elementModel.label}}
+      </button>
+      <input *ngIf="elementModel.imageSrc" type="image" [src]="elementModel.imageSrc"
+             [style.width.%]="100"
+             [style.height.%]="100"
+             [style.object-fit]="'contain'" alt="Bild nicht gefunden">
+    </div>
   `
 })
 export class ButtonComponent extends ElementComponent {

projects/common/element-components/image.component.ts

@@ -5,7 +5,8 @@ import { ImageElement } from '../models/image-element';
 @Component({
   selector: 'app-image',
   template: `
-    <div [style.height.%]="100"
+    <div [style.display]="'flex'"
+         [style.height.%]="100"
          [style.width.%]="100">
       <img [src]="elementModel.src | safeResourceUrl"
            alt="Image Placeholder"

projects/common/models/text-area-element.ts

@@ -24,6 +24,6 @@ export class TextAreaElement extends InputElement implements FontElement, Surfac
     Object.assign(this, initSurfaceElement());
 
     this.backgroundColor = 'transparent';
-    this.height = 120;
+    this.height = 132;
   }
 }