Register page input values display in invalid state by default

[vapvarun]

When validating registration fields, the invalid CSS class is applied on the first load of the registration form, even before filling in any values.

.buddypress-wrap .standard-form input[required]:invalid, .buddypress-wrap .standard-form select[required]:invalid, .buddypress-wrap .standard-form textarea[required]:invalid {
    border-color: #b71717;
}

buddypress/bp-templates/bp-nouveau/css/buddypress.min.css

We can replace it with the following to set the default when nothing is filled.

.buddypress-wrap .standard-form input[required], .buddypress-wrap .standard-form select[required], .buddypress-wrap .standard-form textarea[required] {
    border-color: #d6d6d6;;
}

After submitting values, we already have a different CSS object for the invalid one.

.buddypress-wrap .standard-form input.invalid[required], .buddypress-wrap .standard-form select.invalid[required], .buddypress-wrap .standard-form textarea.invalid[required] {
  border-color: #b71717;
}

[vapvarun]

Register page with default theme

[upenwp12]

patch for #8986

[espellcaste]

@vapvarun Can you confirm if the patch above fixes your issue?

[vapvarun]

Yes, @espellcaste, the above patch will resolve the issue. It was created to help @upenwp12 start contributing to BuddyPress.