Railsチュートリアル第14章で発生するUnfollowボタン表示問題の対処法について

　Macのローカル環境によりRailsチュートリアルを進めていると，14.2.4 [Follow] ボタン (基本編)において，Unfollowボタンの背景が灰色に表示されない問題が発生しました。

　検索結果としては，Bootstrapの仕様なのか大した問題でも無いのか，報告事例が少なく，原因も解決方法も分かりません。

　ただ，このままでは見栄えが良くないことから，次の通り対処したため，参考情報として記載します。

※追伸
　今後しばらくBootstrapのお世話になると思うので，原因が判明したら更新します。

＜対処法＞

　Bootstrapの設定を継承した新classである[btn-secondary]を追加する。
　背景の色は「#BBBBBB」の部分を修正することで変更可能である。

[app/assets/stylesheets/custom.scss] 
・
・
・
/* button :[btn]の色が動作しないため追加 */
.btn-secondary {
  @include button-variant($btn-default-color,
                          #BBBBBB,
                          $btn-default-border);
}

[app/views/users/_unfollow.html.erb] 
<%= form_for(current_user.active_relationships.find_by(followed_id: @user.id),
             html: { method: :delete },
             remote: true) do |f| %>
  <%= f.submit "Unfollow", class: "btn btn-secondary" %>
<% end %>

＜参考情報＞

○ スクリーンショット

４つの画面のうち上の画面から次のClassを適用した。
　1. class: "btn"
　2. class: "btn btn-primary"
　3. class: "btn btn-default"
　4. class: "btn btn-secondary"　※上記対処法で作成

○ 動作確認

＜Unfollowボタンのclass設定を確認＞

・class: "btn"　※Railsチュートリアル通り
　→ボタンのレイアウトにはなる。
　→[hover]による背景の動作無し。
　→色が描画されない。

・class: "btn btn-primary"
　→Followボタンと同じ描画になる。

・class: "btn btn-default"
　→[background-color]は白のまま。
　→[hover]時は灰色になる。

・class: "btn-default" 又は class: "btn-primary"
　→[btn]よりもクリックできる範囲が小さくなる。

＜本番環境を確認＞

・Chrome[macOS，Windows7]
・Safari[macOS]
　→全てローカル環境と同じ動作である。

＜その他＞

・IDE(Cloud9)で作成したsample_appをクローン
・Railsチュートリアル公式サイトにある「CODE SAMPLE」をクローン
　→全て今回作成したsample_appと同じ動作である。

○ 参考サイト

・https://teratail.com/questions/147020
・https://github.com/yasslab/sample_apps/issues/8
　→同問題の報告事例
・https://www.w3schools.com/bootstrap/bootstrap_ref_css_buttons.asp
　→動作確認通りの描画であることを確認
・https://github.com/twbs/bootstrap-sass
　→使用Gemのリポジトリ