From 0e6b9c528222e1633cba1a40baf97dad5c70754f Mon Sep 17 00:00:00 2001
From: rhenck <richard.henck@iqb.hu-berlin.de>
Date: Thu, 7 Oct 2021 16:54:56 +0200
Subject: [PATCH] Add border radius prop for buttons
---
projects/common/element-components/button.component.ts | 3 ++-
projects/common/unit.ts | 1 +
.../page-view/properties/element-properties.component.html | 5 +++++
3 files changed, 8 insertions(+), 1 deletion(-)
diff --git a/projects/common/element-components/button.component.ts b/projects/common/element-components/button.component.ts
index ec2be98c2..ab72d54ce 100644
--- a/projects/common/element-components/button.component.ts
+++ b/projects/common/element-components/button.component.ts
@@ -15,7 +15,8 @@ import { ButtonElement } from '../unit';
[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.text-decoration]="elementModel.underline ? 'underline' : ''"
+ [style.border-radius.px]="elementModel.borderRadius">
{{elementModel.label}}
</button>
<input *ngIf="elementModel.imageSrc" type="image" [src]="elementModel.imageSrc"
diff --git a/projects/common/unit.ts b/projects/common/unit.ts
index 65dbd7352..c8ca01b85 100644
--- a/projects/common/unit.ts
+++ b/projects/common/unit.ts
@@ -84,6 +84,7 @@ export interface TextElement extends SurfaceUIElement {
export interface ButtonElement extends TextUIElement, SurfaceUIElement {
label: string;
imageSrc?: string;
+ borderRadius?: number;
action: undefined | 'previous' | 'next' | 'end';
}
diff --git a/projects/editor/src/app/components/unit-view/page-view/properties/element-properties.component.html b/projects/editor/src/app/components/unit-view/page-view/properties/element-properties.component.html
index 4f616d4ec..a798ce2af 100644
--- a/projects/editor/src/app/components/unit-view/page-view/properties/element-properties.component.html
+++ b/projects/editor/src/app/components/unit-view/page-view/properties/element-properties.component.html
@@ -32,6 +32,11 @@
<img [src]="combinedProperties.imageSrc"
[style.object-fit]="'scale-down'"
[width]="200">
+ <mat-form-field appearance="fill">
+ <mat-label>Kantenradius</mat-label>
+ <input matInput type="number" [value]="combinedProperties.borderRadius"
+ (input)="updateModel('borderRadius', $any($event.target).value)">
+ </mat-form-field>
</div>
<mat-form-field *ngIf="combinedProperties.appearance" appearance="fill">
--
GitLab