Individuell css class for button not working anymore after plugin update

The CSS class for th Submit button was changed to meet accessibility standards that are required for Ninja Forms to be used on many sites.

I was talking about the custom class, which can be added while editing the form and the elements. So, giving a custum or how it is called individual class to the submit button, and call it whatever you like, it could be targeted with css code. That does not work anymore since the last update.

I don’t think the essence of the problem is totally understood. The last update added (at least) two selectors to the Ninja Forms CSS:

.nf-form-content .list-select-wrap .nf-field-element > div, .nf-form-content input:not([type="button"]), .nf-form-content textarea {
background-color: #fff !important;
}

And

.nf-form-content .listselect-wrap .nf-field-element div, .nf-form-content input.ninja-forms-field, .nf-form-content select.ninja-forms-field:not([multiple]) {
height: 41px !important; }

These are already pretty specific selectors, and also use !important. This makes all submit buttons for Ninja Forms have a white background, and a height of 41px.

As you might have guessed, some people like to customize the looks of the forms / buttons they create, and do so using CSS. We have many websites with a button with a background in the theme color of the site and white text on that button. This “accessibility change” makes this a ‘white text on a white background’ situation, which is not very accessible to anyone (except the visitors with the screenreader maybe).

Hard overriding the height of all buttons (with a size set in pixels) is also not very accessible, since when users increase the font size, text becomes squished in the button, and becomes illegible, which is (again) not very accessible.

I understand the need for accessible defaults, but hard overriding all styles already in place does not seem like the solution to me.