2

Twitter Bootstrapは、LESSに基づくTwitterによるクールなスタイルシートツールキットです。私はLESSを使用していませんが、twitter-bootstrap-rails gemを使用しており、すべて正常に機能しているようです。ただし、CSSの色、特にリンクの色を変更する方法がわかりません。

私のさらなる調査では、gemは事前にレンダリングされたCSSファイルに固定色の宣言のみを提供し、1か所で変更できる変数は提供しないことを指摘しているようです。次のような変数を変更するだけで色を変更できるようにしたいと思います$linkColor = #00ff00

LESSを使用せずにUI全体で色を効率的に変更する方法について誰かが考えていますか?

Rails 3.1はすでにSASSを使用しているので、LESSの使用は避けたいと思いますが、ここで両方を使用しても大したことではないと思う人がいれば、私は提案を受け入れます。

どんな助けや提案も大歓迎です

4

3 に答える 3

3

BootstrapからSASS1、2へのかなり人気のある変換を作成しました。これにより、 gemに含まれているものではなく、カスタムヘルパーマニフェストを使用する場合に独自の変数を定義できます。

application.css.scss例として、 :の先頭に

@import "bootstrap/reset";
@import "bootstrap/variables";

// overwrite variables here

@import "bootstrap/mixins";

@import "bootstrap/scaffolding";

@import "bootstrap/type";
@import "bootstrap/forms";
@import "bootstrap/tables";
@import "bootstrap/patterns";

// rest of your manifest

残りのブートストラップファイルをインポートする前に、サポートされている変数を上書きできます。これらの変数には、残りのSCSSからもアクセスできます。

于 2011-11-06T21:51:00.523 に答える
2

良い妥協点を見つけました。.lessソースをフォルダーの下に置き、これをcssに直接ベンダー/アセットにコンパイルするためのガードコマンドがあります。

これにより、意味のある追加の.less内でより少ないミックスインを使用し(つまり、新しい色を追加する)、アプリの残りの部分をscssに保持することができます。

後で遅れる可能性のあるscssの適応ではなく、Twitterのブーストラップソースに直接依存したかったので、これを行いました。

詳細が必要な場合は私に連絡してください、私はそれに関するブログ投稿を計画しています。

于 2011-11-03T22:01:56.523 に答える
0

ブートストラップファイルの2つの別々のSCSSバージョンを見つけました。どちらも(preboot.scssファイル内で)、linkColorなどの変数を変更するだけです。

さて、それらをあなた自身のアプリに統合する方法はわかりません。しかし、LESSを避けたい場合は、SCSSで実行できるようです。

于 2011-10-05T00:09:55.833 に答える