Consider inverting form feedback states cascade

Created by: fiznool

Currently, the form feedback states cascade as follows:

.has-success {}
.has-warning {}
.has-error {}

This results in any elements with the class of .has-error overriding children with the class .has-warning or .has-success.

Consider the following form grouping:

This is a 'complex' form control, with multiple inputs nested inside a single form-group. The validation rules for this control are as such - if any of the inputs are not a number, the entire form control should be invalid - however, I'd like to show which individual input is in error.

I would like to achieve this with the following markup:

<form>
  <div class="form-group has-error">
    <span class="label label-danger pull-right">Invalid</span>
    <label for="relativeDays" class="control-label">Enter Duration</label>
    <div class="row">
      <div class="col-xs-4">
        <div class="input-group has-success">
          <input type="number" class="form-control" id="relativeDays">
          <div class="input-group-addon">days</div>
        </div>
      </div>
      <div class="col-xs-4">
        <div class="input-group has-success">
          <input type="number" class="form-control" id="relativeHours">
          <div class="input-group-addon">hours</div>
        </div>
      </div>
      <div class="col-xs-4">
        <div class="input-group has-error">
          <input type="number" class="form-control" id="relativeMins">
          <div class="input-group-addon">mins</div>
        </div>
      </div>
    </div>
    <p class="help-block">Delay this task by the specified number of days, hours and minutes after the previous task is completed.</p>
  </div>
</form>

Notice the .has-error on the parent form-group, indicating that the form control is invalid, however the individual has-success and has-error classes on the child inputs.

With the current cascade rules, this is not possible, but this PR inverts the cascade, allowing for this possibility.