diff --git a/lib/core/src/lib/form/components/form-renderer.component.scss b/lib/core/src/lib/form/components/form-renderer.component.scss
index 956c09af4d..7f88f2a7f5 100644
--- a/lib/core/src/lib/form/components/form-renderer.component.scss
+++ b/lib/core/src/lib/form/components/form-renderer.component.scss
@@ -21,10 +21,10 @@
width: auto;
}
- .adf-form-field-input:not(.adf-inplace-input-mat-form-field, .adf-people-cloud, .adf-cloud-group) {
- #{ms.$mat-form-field-subscript-wrapper} {
- height: 40px;
- }
+ .adf-form-field-status-slot {
+ display: block;
+ height: 40px;
+ box-sizing: border-box;
}
}
diff --git a/lib/core/src/lib/form/components/widgets/amount/amount.widget.html b/lib/core/src/lib/form/components/widgets/amount/amount.widget.html
index 00fefd8e34..76104bba6d 100644
--- a/lib/core/src/lib/form/components/widgets/amount/amount.widget.html
+++ b/lib/core/src/lib/form/components/widgets/amount/amount.widget.html
@@ -10,7 +10,11 @@
>
-
+
@if ( (field.name || field?.required) && !field.leftLabels) { {{field.name | translate }} }
@if(!enableDisplayBasedOnLocale) {
{{ currency }}
@@ -32,12 +36,13 @@
(blur)="amountWidgetOnBlur()"
/>
@if (field.validationSummary?.message || (isInvalidFieldRequired() && isTouched())) {
-
+
error_outline
@if (field.validationSummary?.message) {{{ field.validationSummary.message | translate:translateParameters }}} @else {{{ 'FORM.FIELD.REQUIRED' | translate }}}
}
+
diff --git a/lib/core/src/lib/form/components/widgets/date-time/date-time.widget.html b/lib/core/src/lib/form/components/widgets/date-time/date-time.widget.html
index d1c5a7b33b..1457221133 100644
--- a/lib/core/src/lib/form/components/widgets/date-time/date-time.widget.html
+++ b/lib/core/src/lib/form/components/widgets/date-time/date-time.widget.html
@@ -10,6 +10,7 @@
@if( (field.name || field?.required) && !field.leftLabels) {
@@ -38,11 +39,12 @@
[timeInterval]="5"
[disabled]="field.readOnly" />
@if (datetimeInputControl.invalid && datetimeInputControl.touched && field.validationSummary?.message) {
-
+
error_outline
{{ field.validationSummary.message | translate:translateParameters }}
}
+
diff --git a/lib/core/src/lib/form/components/widgets/date/date.widget.html b/lib/core/src/lib/form/components/widgets/date/date.widget.html
index f36c6ae24e..8633b8db24 100644
--- a/lib/core/src/lib/form/components/widgets/date/date.widget.html
+++ b/lib/core/src/lib/form/components/widgets/date/date.widget.html
@@ -1,7 +1,7 @@
-
+
@@ -22,11 +22,12 @@
[startAt]="startAt"
[disabled]="field.readOnly" />
@if (dateInputControl.invalid && dateInputControl.touched) {
-
+
error_outline
@if (dateInputControl.hasError('required')) {{{ 'FORM.FIELD.REQUIRED' | translate }}} @else if (dateInputControl.hasError('matDatepickerParse')) {{{ 'FORM.FIELD.VALIDATOR.INVALID_DATE_FORMAT' | translate: { format: field.dateDisplayFormat || field.defaultDateTimeFormat } }}} @else if (dateInputControl.hasError('matDatepickerMin')) {{{ 'FORM.FIELD.VALIDATOR.NOT_LESS_THAN' | translate: { minValue: formattedMinDate } }}} @else if (dateInputControl.hasError('matDatepickerMax')) {{{ 'FORM.FIELD.VALIDATOR.NOT_GREATER_THAN' | translate: { maxValue: formattedMaxDate } }}}
}
+
diff --git a/lib/core/src/lib/form/components/widgets/decimal/decimal.component.html b/lib/core/src/lib/form/components/widgets/decimal/decimal.component.html
index e2c5be4965..c531e78288 100644
--- a/lib/core/src/lib/form/components/widgets/decimal/decimal.component.html
+++ b/lib/core/src/lib/form/components/widgets/decimal/decimal.component.html
@@ -9,7 +9,7 @@
-
+
@if ( (field.name || field?.required) && !field.leftLabels) { {{ field.name | translate }} }
@if (field.validationSummary?.message || (isInvalidFieldRequired() && isTouched())) {
-
+
error_outline
@if (field.validationSummary?.message) {{{ field.validationSummary.message | translate:translateParameters }}} @else {{{ 'FORM.FIELD.REQUIRED' | translate }}}
}
+
diff --git a/lib/core/src/lib/form/components/widgets/hyperlink/hyperlink.widget.scss b/lib/core/src/lib/form/components/widgets/hyperlink/hyperlink.widget.scss
index 91025303f0..4dedad8795 100644
--- a/lib/core/src/lib/form/components/widgets/hyperlink/hyperlink.widget.scss
+++ b/lib/core/src/lib/form/components/widgets/hyperlink/hyperlink.widget.scss
@@ -1,7 +1,6 @@
.adf-hyperlink-widget {
padding: 0.4375em 0;
- border-top: 0.8438em solid transparent;
- margin-bottom: 20px;
+ margin-bottom: 40px;
a {
color: var(--mat-sys-primary);
diff --git a/lib/core/src/lib/form/components/widgets/multiline-text/multiline-text.widget.html b/lib/core/src/lib/form/components/widgets/multiline-text/multiline-text.widget.html
index cea1673327..73d7d5036a 100644
--- a/lib/core/src/lib/form/components/widgets/multiline-text/multiline-text.widget.html
+++ b/lib/core/src/lib/form/components/widgets/multiline-text/multiline-text.widget.html
@@ -7,6 +7,7 @@
0"
[floatLabel]="field.placeholder ? 'always' : null"
>
@@ -31,14 +32,16 @@
>
@if (field.validationSummary?.message || (isInvalidFieldRequired() && isTouched())) {
-
+
@if (field.maxLength > 0) {{{ field?.value?.length || 0 }}/{{ field.maxLength }}}
error_outline
@if (field.validationSummary?.message) {{{ field.validationSummary.message | translate:translateParameters }}} @else {{{ 'FORM.FIELD.REQUIRED' | translate }}}
} @else if (field.maxLength > 0) {
- {{ field?.value?.length || 0 }}/{{ field.maxLength }}
+ {{ field?.value?.length || 0 }}/{{ field.maxLength }}
+ } @else {
+
}
diff --git a/lib/core/src/lib/form/components/widgets/number/number.widget.html b/lib/core/src/lib/form/components/widgets/number/number.widget.html
index 11999ea2b1..344d5c9abd 100644
--- a/lib/core/src/lib/form/components/widgets/number/number.widget.html
+++ b/lib/core/src/lib/form/components/widgets/number/number.widget.html
@@ -9,7 +9,7 @@
-
+
@if( (field.name || this.field?.required) && !field.leftLabels) {
{{ field.name | translate }}
@@ -30,12 +30,13 @@
[errorStateMatcher]="errorStateMatcher"
(blur)="onBlur()">
@if (field.validationSummary?.message || (isInvalidFieldRequired() && isTouched())) {
-
+
error_outline
@if (field.validationSummary?.message) {{{ field.validationSummary.message | translate:translateParameters }}} @else {{{ 'FORM.FIELD.REQUIRED' | translate }}}
}
+
diff --git a/lib/core/src/lib/form/components/widgets/text/text.widget.html b/lib/core/src/lib/form/components/widgets/text/text.widget.html
index e1fc6d47e0..e9dee6e3b9 100644
--- a/lib/core/src/lib/form/components/widgets/text/text.widget.html
+++ b/lib/core/src/lib/form/components/widgets/text/text.widget.html
@@ -8,7 +8,11 @@
-
+
@if ( (field.name || this.field?.required) && !field.leftLabels) {
{{ field.name | translate }}
@@ -30,7 +34,7 @@
(paste)="onPaste($event)"
(blur)="onBlur()">
@if (!fieldStatusTemplate && (maxLengthPasteError.isActive() || field.validationSummary?.message || (isInvalidFieldRequired() && isTouched()))) {
-
+
@if (maxLengthPasteError.isActive()) {
@@ -43,6 +47,9 @@
}
+ @if (!fieldStatusTemplate) {
+
+ }
diff --git a/lib/core/src/lib/styles/_mat-selectors.scss b/lib/core/src/lib/styles/_mat-selectors.scss
index dba941cafa..31fa2b1208 100644
--- a/lib/core/src/lib/styles/_mat-selectors.scss
+++ b/lib/core/src/lib/styles/_mat-selectors.scss
@@ -17,7 +17,6 @@ $mat-button: '.mat-mdc-button';
$mat-button-label: '.mdc-button__label';
$mat-form-field: '.mat-mdc-form-field';
$mat-form-field-wrapper: '.mat-mdc-text-field-wrapper';
-$mat-form-field-subscript-wrapper: '.mat-mdc-form-field-subscript-wrapper';
$mat-line-ripple: '.mdc-line-ripple';
$mat-form-field-prefix: '.mat-mdc-form-field-text-prefix';
$mat-form-field-suffix: '.mat-mdc-form-field-text-suffix';
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/data-table/data-table.widget.scss b/lib/process-services-cloud/src/lib/form/components/widgets/data-table/data-table.widget.scss
index ed9398c207..8fcb2550ac 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/data-table/data-table.widget.scss
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/data-table/data-table.widget.scss
@@ -1,11 +1,12 @@
.adf-data-table-widget-failed-message {
display: block;
- margin: 10px;
}
-.adf-preview-placeholder {
- height: 100%;
- width: 100%;
- min-height: 100px;
- margin-bottom: 10px;
+.adf-data-table-widget-container {
+ .adf-preview-placeholder {
+ height: 100%;
+ width: 100%;
+ min-height: 100px;
+ margin-bottom: 10px;
+ }
}
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html b/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html
index 1cc7d8e98b..bde9f411f9 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html
@@ -15,7 +15,11 @@
>
-
+
@if ( (field.name || field?.required) && !field.leftLabels) {
{{field.name | translate }} ({{field.dateDisplayFormat}})
@@ -36,12 +40,13 @@
@if (dateInputControl.invalid && dateInputControl.touched) {
-
+
error_outline
@if (dateInputControl.hasError('required')) {{{ 'FORM.FIELD.REQUIRED' | translate }}} @else if (dateInputControl.hasError('matDatepickerParse')) {{{ 'FORM.FIELD.VALIDATOR.INVALID_DATE_FORMAT' | translate: { format: field.dateDisplayFormat || field.defaultDateTimeFormat } }}} @else if (dateInputControl.hasError('matDatepickerMin')) {{{ 'FORM.FIELD.VALIDATOR.NOT_LESS_THAN' | translate: { minValue: formattedMinDate } }}} @else if (dateInputControl.hasError('matDatepickerMax')) {{{ 'FORM.FIELD.VALIDATOR.NOT_GREATER_THAN' | translate: { maxValue: formattedMaxDate } }}}
}
+
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/display-external-property/display-external-property.widget.html b/lib/process-services-cloud/src/lib/form/components/widgets/display-external-property/display-external-property.widget.html
index 39a356ac8d..709d994c44 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/display-external-property/display-external-property.widget.html
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/display-external-property/display-external-property.widget.html
@@ -11,7 +11,7 @@
-
+
@if( (field.name || field?.required) && !field.leftLabels) {
{{ field.name | translate }}
}
@@ -32,8 +32,9 @@
@if (propertyLoadFailed && !previewState) {
- error_outline{{ 'FORM.FIELD.EXTERNAL_PROPERTY_LOAD_FAILED' | translate }}
+ error_outline{{ 'FORM.FIELD.EXTERNAL_PROPERTY_LOAD_FAILED' | translate }}
}
+
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html b/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html
index eedec326ff..e994d83967 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html
@@ -12,7 +12,7 @@
}
-
+
@if ( (field.name || this.field?.required) && !field.leftLabels) {
{{ field.name | translate }}
}
@@ -49,12 +49,13 @@
}
@if ((dropdownControl.hasError('required') && !isRestApiFailed && !variableOptionsFailed) || (!previewState && !field.readOnly && (isRestApiFailed || variableOptionsFailed))) {
-
+
error_outline
@if (dropdownControl.hasError('required') && !isRestApiFailed && !variableOptionsFailed) {{{ 'FORM.FIELD.REQUIRED' | translate }}} @else if (isRestApiFailed) {{{ 'FORM.FIELD.REST_API_FAILED' | translate: { hostname: restApiHostName } }}} @else if (variableOptionsFailed) {{{ 'FORM.FIELD.VARIABLE_DROPDOWN_OPTIONS_FAILED' | translate }}}
}
+
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/radio-buttons/radio-buttons-cloud.widget.scss b/lib/process-services-cloud/src/lib/form/components/widgets/radio-buttons/radio-buttons-cloud.widget.scss
index ae2d2c54f7..ca6a8fae94 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/radio-buttons/radio-buttons-cloud.widget.scss
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/radio-buttons/radio-buttons-cloud.widget.scss
@@ -45,8 +45,4 @@
word-break: break-word;
}
}
-
- &-radio-group-error-message .adf-error-container {
- margin-top: 5px;
- }
}
diff --git a/lib/process-services-cloud/src/lib/group/components/group-cloud.component.scss b/lib/process-services-cloud/src/lib/group/components/group-cloud.component.scss
index 7cca3876c9..d7e1aa5a21 100644
--- a/lib/process-services-cloud/src/lib/group/components/group-cloud.component.scss
+++ b/lib/process-services-cloud/src/lib/group/components/group-cloud.component.scss
@@ -63,6 +63,7 @@
}
.adf-error {
+ padding-top: 3px;
animation: slide-down-fade-in 300ms cubic-bezier(0.55, 0, 0.55, 0.2);
}
}
diff --git a/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss b/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss
index 668683bfc0..a4ed4e3cdb 100644
--- a/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss
+++ b/lib/process-services-cloud/src/lib/people/components/people-cloud.component.scss
@@ -66,6 +66,10 @@
@include mixins.adf-error-icon;
}
+ .adf-error {
+ padding-top: 3px;
+ }
+
.adf-error-animate {
animation: adf-people-cloud-slide-in-down 300ms cubic-bezier(0.55, 0, 0.55, 0.2);
}