@@ -12,15 +12,16 @@ export class UmbImageCropperEditorFieldElement extends UmbInputImageCropperField
12
12
<slot name= "actions" > </ slot>
13
13
${ when (
14
14
! this . hideFocalPoint ,
15
- ( ) =>
16
- html ` <uui- butto n
15
+ ( ) => html `
16
+ <uui- butto n
17
17
compact
18
18
id= "reset-focal-point"
19
19
label = ${ this . localize . term ( 'content_resetFocalPoint' ) }
20
20
@click = ${ this . onResetFocalPoint } >
21
21
<uui- icon name= "icon-axis-rotation" > </ uui- icon>
22
22
${ this . localize . term ( 'content_resetFocalPoint' ) }
23
- </ uui- butto n> ` ,
23
+ </ uui- butto n>
24
+ ` ,
24
25
) }
25
26
` ;
26
27
}
@@ -37,13 +38,14 @@ export class UmbImageCropperEditorFieldElement extends UmbInputImageCropperField
37
38
${ repeat (
38
39
this . crops ,
39
40
( crop ) => crop . alias + JSON . stringify ( crop . coordinates ) ,
40
- ( crop ) =>
41
- html ` <umb- image-cropper- preview
41
+ ( crop ) => html `
42
+ <umb- image-cropper- preview
42
43
?active= ${ this . currentCrop ?. alias === crop . alias }
43
44
@click = ${ ( ) => this . onCropClick ( crop ) }
44
45
.crop = ${ crop }
45
46
.focalPoint = ${ this . focalPoint }
46
- .src = ${ this . source } > </ umb- image-cropper- preview> ` ,
47
+ .src = ${ this . source } > </ umb- image-cropper- preview>
48
+ ` ,
47
49
) } `;
48
50
}
49
51
@@ -55,13 +57,15 @@ export class UmbImageCropperEditorFieldElement extends UmbInputImageCropperField
55
57
gap : var (--uui-size-space-3 );
56
58
height : 400px ;
57
59
}
60
+
58
61
# main {
59
62
width : 100% ;
60
63
height : 100% ;
61
64
display : flex;
62
65
gap : var (--uui-size-space-1 );
63
66
flex-direction : column;
64
67
}
68
+
65
69
# actions {
66
70
display : flex;
67
71
justify-content : space-between;
@@ -92,6 +96,7 @@ export class UmbImageCropperEditorFieldElement extends UmbInputImageCropperField
92
96
umb-image-cropper-focus-setter {
93
97
height : calc (100% - 33px - var (--uui-size-space-1 )); /* Temp solution to make room for actions */
94
98
}
99
+
95
100
# side {
96
101
display : grid;
97
102
grid-template-columns : repeat (auto-fill, minmax (100px , 1fr ));
0 commit comments