🌊
Material Design Bootstrap（MDB）でフォームのボーダーの色を変更する方法
株式会社TECH LUCKという会社で代表兼エンジニアをしている齊藤です。
Material Design Bootstrap（MDB）でCSSを以下のように設定すると、フォームの色とプレースホルダーのテキストの色を変更してくれます。
!importantを存分に使ってしまっているので、参考程度にお願いします。
# フォーカスしていない時の色の変更
.form-control ~ .form-notch div {
border-color: green !important;
}
.form-control ~ .form-label {
color: green !important;
}
# フォーカスしている時の色の変更
.form-control:focus ~ .form-notch div {
border-color: green !important;
}
.form-control:focus ~ .form-label {
color: green !important;
}
また、バリデーションにかかった際のフォームの色とプレースホルダーのテキストの色を変更するには以下のようにします。（.is-invalidがつくだけ。）
.form-control.is-invalid:focus ~ .form-notch div {
border-color: !important;
}
.form-control.is-invalid:focus ~ .form-label {
color: blue !important;
}
参考にした記事
Discussion