diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/components/input-image-cropper/image-cropper.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/components/input-image-cropper/image-cropper.element.ts index 1b63078851..e59f9dd993 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/components/input-image-cropper/image-cropper.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/components/input-image-cropper/image-cropper.element.ts @@ -332,9 +332,9 @@ export class UmbImageCropperElement extends LitElement { value="0" step="0.001">
- Reset crop - Cancel - Save Crop + + +
`; } @@ -363,6 +363,7 @@ export class UmbImageCropperElement extends LitElement { #actions { display: flex; justify-content: flex-end; + gap: var(--uui-size-space-1); } #mask { diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/components/input-image-cropper/input-image-cropper.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/components/input-image-cropper/input-image-cropper.element.ts index cd43e2af2a..27da9dcf0b 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/components/input-image-cropper/input-image-cropper.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/components/input-image-cropper/input-image-cropper.element.ts @@ -89,13 +89,7 @@ export class UmbInputImageCropperElement extends LitElement { render() { return html` -
- ${this.#renderMain()} -
- Remove files (NOT IMPLEMENTED YET) - Reset focal point -
-
+
${this.#renderMain()}
${this.#renderSide()}
`; } @@ -108,9 +102,13 @@ export class UmbInputImageCropperElement extends LitElement { .focalPoint=${this.focalPoint} .value=${this.currentCrop}>` : html``; + @change=${this.#onFocalPointChange} + .focalPoint=${this.focalPoint} + .src=${this.src}> +
+ Remove files (NOT IMPLEMENTED YET) + Reset focal point +
`; } #renderSide() {