picocss/pico

Suggestion: make submit buttons inside forms with invalid inputs have the same look as disabled buttons

AndreLeria opened this issue · 0 comments

I believe this would be useful for simpler forms which don't require javascript validation: while the button will technically still be enabled and clickable, the browser's form validation won't allow it to submit the form.

A simple solution would be to include a :has(:invalid) selector in line 204 here:

// Button [disabled]
#{$parent-selector}
:where(button, [type="submit"], [type="reset"], [type="button"], [role="button"])[disabled],
#{$parent-selector}
:where(fieldset[disabled])
:is(button, [type="submit"], [type="button"], [type="reset"], [role="button"]) {
opacity: 0.5;
pointer-events: none;
}

But this would also apply to reset buttons and not make it optional, which I believe are undesirable for such a change. Still, making it optional and not applying it to reset buttons should not add too much complexity.