Bootstrap と google code prettyfier を一緒に使用しようとしていますが、最終的な結果はかなり残念です。でGemfile
:
gem 'bootstrap-sass', '~> 2.2.1.1'
gem 'google-code-prettify-rails'
でapplication.css
:
*= require bootstrap
*= require google-code-prettify-rails/prettify
でapplication.js
:
//= require bootstrap$
//= require google-code-prettify-rails/prettify
//= require google-code-prettify-rails/lang-sql
そしてprettyPrint()
、.coffee スクリプトからロード時に実行します。
jQuery ->
prettyPrint()
すべて正常に動作し、<code class="prettyprint lang-sql">...</code>
フォーマットされます。しかし、悲しいことに、それをフォーマットする CSS は、Bootsrap の CSS と prettyprint テーマの CSS の混合物であり、表示が見苦しくなります。Element Inspect は、Bootstrap から適用されたスタイルを示しています。
/* line 8, .../bootstrap-sass-2.2.1.1/vendor/assets/stylesheets/bootstrap/_code.scss */
code,
pre {
padding: 0 3px 2px;
font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
font-size: 12px;
color: #333333;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
/* line 17, .../bootstrap-sass-2.2.1.1/vendor/assets/stylesheets/bootstrap/_code.scss */
code {
padding: 2px 4px;
color: #d14;
background-color: #f7f7f9;
border: 1px solid #e1e1e8;
}
私の質問は
- アセット パイプラインに Bootstrap 自身のものを含めないようにする方法はあり
_code.scss
ますか? - そうでない場合、Bootstrap の適用されたスタイルをリセットするにはどうすればよいですか?