Border-lines are malfunctioning in the facility creation page

[nihal467]

Describe the bug

When we are opening the facility creation page, by default, some field borderlines are red.

To Reproduce

https://care.coronasafe.in/facility/create

Expected behavior

red borderline should only be shown when there is an error by the user.

Screenshots

[rithviknishad]

@Ashesh3 can you remove the invalid:border-danger-500 from cui-input-base class?

I added it to make required fields error out if it's invalid / empty.

or is there a way to not validate the input until the element got focus or something?

[Ashesh3]

or is there a way to not validate the input until the element got focus or something?

@rithviknishad I am afraid that'd require additional JS to keep a watch for the initial focus, how about we keep the existing behavior where the fields will only be validated after a form submission?

cc: @nihal467

[rithviknishad]

I thought there was something like (HTML way) since it's pretty common behaviour in other websites to not validate until focus.

Additional JS, I also wouldn't proceed 😅

[Ashesh3]

I thought there was something like (HTML way) since it's pretty common behaviour in other websites to not validate until focus.

Additional JS, I also wouldn't proceed 😅

I am personally not aware of any such method, tried asking OpenAI too 😬 .

So, I guess we'll have to keep the existing behavior in this case.