Scaffold CSS with error_explanation/field_with_errors

Question

私はMichael HartlのRuby on Railsチュートリアルに従っており、Bootstrapフォームの検証が組み込みのRoRスタイリングの代わりに機能するようになっています。マイページは、この（インスペクタを介して除去スタイル）のように見えるようになっている：

代わりに私が手：

私は

@import "bootstrap-sprockets"; 
 
@import "bootstrap"; 
 

 
#error_explanation { 
 
    color: red; 
 
    ul { 
 
     color: red; 
 
     margin: 0 0 30px 0; 
 
    } 
 
} 
 

 
.field_with_errors { 
 
    @extend .has-error; 
 
}

custom.scss次ています

これは、以下のようなOKS：

<% if game.errors.any? %> 
 
    <div id="error_explanation"> 
 
     <div class="alert alert-danger"> 
 
      <%= pluralize(game.errors.count, "error") %> prohibited this game from being saved: 
 
     </div> 
 
     <ul> 
 
      <% @game.errors.full_messages.each do |msg| %> 
 
       <li><%= msg %></li> 
 
      <% end %> 
 
     </ul> 
 
    </div> 
 

 
... 
 

 
<div class="form-group"> 
 
<%= f.label :game_name, :class => "col-sm-2 control-label" %> 
 
<div class="col-sm-10"> 
 
    <%= f.text_field(:game_name, {:class => "form-control"}) %> 
 
</div> 
 
</div>

私はブートストラップがscaffold.scssを上書き持ってする方法を探してみたので、私は私のapplication.cssに、以下に示すrequire custom

*= require_tree . 
 
*= require_self 
 
*= require custom

を置きます

私が見てきたほとんどの質問この種類の問題では、現在のバージョンのBootstrapに間違ったクラスを使用しているためにBootstrapクラスが表示されないだけですが、クラスは足場CSSのすぐ上に正しくロードされています。

Answer 1

Scaffoldsスタイルシートはカスタムスタイルシートを上書きしていません。 #error_explanationと.field_with_errorsに追加のプロパティを追加します。

埋め込みのようなプロパティ：2px;背景色：赤;表示：テーブル; アセットパイプラインは、一日の終わりに、すべてのスタイルシートを連結し、記載された問題を引き起こします。

あなたは、単にアプリ/資産/スタイルシート/に移動し、scaffolds.scssを削除足場スタイルシートを維持する必要がない場合。 しかし、足場のスタイルシートを保持したい場合は、手動で編集することを検討するか、アプリケーションのさまざまな部分に異なるレイアウトをレンダリングする必要があります。

.field_with_errors Michael Hartl's tutorialで次のようになります定義に若干の違いもあります：

.field_with_errors { 
    @extend .has-error; 
    .form-control { 
    color: $state-danger-text; 
    } 
} 

は、