Once more I'm looking to update our approach to forms in BS3. Overall the goals here are:
- simplicity (in code and presentation)
- flexibility (not tying ourselves too close to specific HTML)
- consistency (using the same patterns as elsewhere in the project)
To that end, I've made the following changes:
-
Use
.form-control
for styling form controls instead of list of input types. Fewer lines of code, less specific (meaning easier overrides asinput[type="text"]
is more specific than.input
), less intrusive, and more performant. -
Adds new
.form-group
class to space out groups of form controls when in vertical mode. (Horizontal forms will continue to use the predefined grid classes.) - Updates form validation classes to separate HTML and CSS. While not directly applicable to individual inputs, the markup is very flexible given the classes we use.
Still needs refinement I think, but overall I like it.