How to modify wrapper div error class when using CakePHP with Bootstrap

Question

I\'m using Bootstrap 3.0RC1 with CakePHP 2.3.6. Trying to take advantage of those beautiful looking classes like has-error and has-w

Answer 1

I agree with Dereks first answer, adding your styles into the Bootstrap CSS file.

Lines 1590-1611

    .has-error .help-block,
    .has-error .control-label {
      color: #b94a48;
    }

    .has-error .form-control {
      border-color: #b94a48;
      -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
              box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    }

    .has-error .form-control:focus {
      border-color: #953b39;
      -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392;
              box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392;
    }

    .has-error .input-group-addon {
      color: #b94a48;
      background-color: #f2dede;
      border-color: #b94a48;
    }

You should change this to:

    .error .help-bloc, .has-error .help-block,
    .error .control-label, .has-error .control-label {
      color: #b94a48;
    }

    .error .form-control, .has-error .form-control {
      border-color: #b94a48;
      -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
              box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    }

    .error .form-control:focus, .has-error .form-control:focus {
      border-color: #953b39;
      -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392;
              box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392;
    }

    .error .input-group-addon, .has-error .input-group-addon {
      color: #b94a48;
      background-color: #f2dede;
      border-color: #b94a48;
    }