Rails のフォームに Bootstrapのエラー用デザインを適用させる。

Rails のフォームで、validationに引っかかるとその要素に

.field_with_errors

ってクラスがつくのですが、画像のようにBootstrapのフォーム用のエラーCSSを適用させる方法。

僕はBootstrapのsassバージョンを使用してるので、以下のようなファイルを作成して application.css.sass から

@import base

とかしてる。で、肝心な部分は

• base.css.sass

.field_with_errors
  @include formFieldState(#b94a48, #ee5f5b, lighten(#ee5f5b, 30%))
  @extend .error

最後に

手軽にそれっぽいデザインできるの楽でいい。