TemplateForm with FormFields (with Start) missplace modified/valid css class

Radzen.Blazor Components
1

When i use a FormFields with "Start" ChildContent inside my TemplateForm, the css class "modified" and "valid" gets added to the input container. This results in a valid border only for the input and not the entire FormField container as seen on this image:
image

I have tried to move the css classes to the container with the css class "rz-form-field-content" and then seems to show it correctly (in my opinion).

image
image1151×199 16.9 KB

image

Correct me if i am wrong :slight_smile:

As always thanks for the awsome components.

Tested on latest version 5.5.1

2

Hi @olefosdal,

Indeed those classes are applied to the input component only. You can use some additional CSS to apply the border where it is needed:

<style>
    .rz-form-field-content:has(.valid) {
        border: 1px solid green;
    }

    .rz-form-field-content .valid {
       border: none;
    }

    .rz-form-field-content:has(.invalid) {
        border: 1px solid red;
    }

    .rz-form-field-content .invalid {
       border: none;
    }
</style>
1 Like