問題タブ [bootstrap-sass]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
3 に答える
9085 参照

ruby-on-rails - Railsアプリでbootstrap-sassでtwitterブートストラップを使用するには?

私はこれにかなり慣れていませんが、問題を理解できません。

Twitterのブートストラップでは、次を使用します:

そして、それはすべて正常に機能します。しかし、私は spanX と spanY を html ファイルに直接書きたくないので、意味のあるクラス名を付けたいと思います。例えば:

https://github.com/thomas-mcdonald/bootstrap-sassを使用しているという事実を考えると、scss ファイルをどのように記述すればよいですか? 次のことを試しましたが、うまくいきません (2 つの列が表示されません)。

生成されたコードを見ると、すべて問題ないように思えます。

等々。

私は何を間違っていますか?

アップデート:

わかりました、何が間違っているのかを明確にするために-列は、実際の列(互いに隣り合っている)のように、行として(次々に)レイアウトされています。例:

ブートストラップの場合: Column1 Column2
カスタム クラスの場合:
最初の列
2 番目の列

Chrome で要素のレイアウトを調べたところ、ブートストラップ クラスには float プロパティがあり、私のものはないようです。CSS ソースを見ると、次のようなクラスが表示されます。

したがって、私の場合、次のようなものを生成する必要があると思います: [class*="user-filter"] { float: left; 左マージン: 20px; }

か否か?

0 投票する
3 に答える
11621 参照

ruby-on-rails - bootstrap-sass: 未定義の変数: "$baseLineHeight"

bootstrap-sass を使用して、ブートストラップをアプリに統合しました。アプリはローカル マシンで正常に動作しますが、capistrano 経由でデプロイすると、次のエラーが発生します。

カピストラーノが走ろうとするときassets:precompile

この変数は、プリコンパイルが試行された最初のscssファイルの最初の変数であるため、エラーをスローしていると思います。

何かが正しく読み込まれていません。それが何であるかについてのアイデアはありますか?

編集

完全なトレースはこちらhttps://gist.github.com/2233071

編集 2

gist に application.rb と production.rb を追加

0 投票する
2 に答える
1290 参照

css - ドロップダウンに奇妙な矢印を追加するTwitter Bootstrapレスポンシブメニュー

レスポンシブ Twitter ブートストラップ ナビでこれが発生する理由がわかりません。スクリーンショットは次のとおりです。

https://www.evernote.com/shard/s3/sh/79b436f8-822c-4fdc-ad36-a1d706686d05/3a735fc948474e109c08b773f01f0cf8

上向きの奇妙な矢印を追加しています。キャレットは意図されたものであり、問​​題ありません。dropdownからすべてのクラスを削除すると消え<li class="dropdown">ます。しかし、そうするとナビが壊れます。それ以外の場合、ナビはうまく機能しています。ここに私のマークアップがあります:

このマークアップには何の問題もないように見えますが、これらの小さな矢印が表示され続けます。css でオーバーライドしようとするよりも、ブートストラップで何が間違っているのかを理解したいと思います

これらの矢印を取り除くにはどうすればよいですか?

参考までに、bootstrap-sass gem を使用して Twitter ブートストラップをインポートしています。

0 投票する
1 に答える
5178 参照

ruby-on-rails - レスポンシブ ブートストラップ サス セットアップ

レスポンシブ デザインの Ruby on Rails 3.2.8 サイトに、bootstrap-sass (2.1.0.0)を使用しようとしています。これは、Rails または Bootstrap を使用したレスポンシブ デザインの最初の試みです。

問題は、すべてではありませんが、CSS スタイルの一部が適切なセレクターに一致していることです。具体的には、たとえば.navbar-fixed-topcustom.css.scss に適用するカスタム スタイルは、コンパイル済みの custom.css スタイルシートとブラウザーでレンダリングされたページの両方に表示されます。ただし、.navbar-fixed-top (Chrome のインスペクターによると) コンパイルされた custom.css にはレスポンシブな Bootstrap スタイルが表示されますが、ブラウザーでレンダリングされたページには表示されませ

custom.css.scss 内で default に@import "bootstrap-responsive";戻すと、レンダリングされたページに@import "bootstrap";Bootstrap スタイルが.navbar-fixed-top表示されます。この問題は、特に応答性に関連しているようです。

特定の問題に関連する関連情報を見つけるのに苦労しました。Bootstrap のデフォルトmeta name="viewport"タグを<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">after find this questionに変更しましたが、私の問題は iPhone 固有のものではありません。

$ rails serverまた、この問題のトラブルシューティング中に を再起動しました。

これをさらにトラブルシューティングする方法がわかりません。どんな助けでも大歓迎です。

0 投票する
4 に答える
4361 参照

ruby-on-rails - Rails 3.2のbootstrap-sassがインストールされていません

Rails 3.2 アプリに bootstrap-sass gem をインストールしようとしていますが、呼び出すと次のエラーが発生しますcompass install bootstrap

そのようなフレームワークはありません: 「ブートストラップ」

Gemfile に gem をインストールしました。

import ステートメントを application.css.scss ファイルに追加しました。

application.js にブートストラップが必要です。

config.ru ファイルに bootstrap-sass が必要です。

問題が何であるか、または同じ問題に遭遇した人はいますか?

これがbootstrap-sassのgitです: https://github.com/thomas-mcdonald/bootstrap-sass.git

0 投票する
1 に答える
2973 参照

ruby-on-rails - Rails 3 + Twitter Bootstrap + SASS のセットアップ

いくつかのトリッキーな相互作用を追跡しようとしています。シナリオは次のとおりです。

  • sass-twitter-bootstrap github リポジトリを使用しています。scss ファイルの完全なセットを assets/twitter ディレクトリにコピーしました

私のapplication.cssが次のようになると:

ホームページを更新すると、次のエラーが表示されます。

私のapplication.cssが次のようになると:

その後、エラーは発生しませんが、custom.css.scss は適用されません。

そして、私の custom.css.sccs は次のようになります。

ここに私の宝石ファイルがあります:

0 投票する
1 に答える
661 参照

ruby-on-rails - Sass::SyntaxError in Static_pages#contact

Hartl のチュートリアル (この時点で第 5 章まで - http://ruby.railstutorial.org/chapters/filling-in-the-layout#code-signup_button ) に従っていますが、彼の指示に従っているかのように感じますが、 sample_app ホームページをオンラインで表示しようとすると、このエラー メッセージが表示され続けます。Sass::SyntaxError in Static_pages#contact続いてFile to import not found or unreadable: bootstrap.、bootstrap-sass gem を Gemfile に追加し、ファイル app/assets/stylesheets/custom.css.scss を作成し、Bootstrap CSS を追加しました。そのファイル ( @import "bootstrap";) に追加します。解決策を探しているいくつかの同様のスレッドを見て、いくつかのオプションを試しましたが、何も機能しませんでした. 何かご意見は?助けていただければ幸いです...

0 投票する
0 に答える
365 参照

jquery - jquery replaceWithとブートストラップモーダル

Rails 3.2.9でbootstrap-sass 2.1.1.0を使用しています。モーダル内に ajax フォームがあります。このような:

送信が成功した後、モーダルを非表示にして、モーダルの下のページの要素を置き換えたい: (update.js.erb)

問題は:時々 (90% うまくいく)、replaceWith($('#avatars_avatar_medium'). replaceWith('<%= j render "avatar_medium", avatar: @avatar, user: @user %>'); ) 動作しないようです。マイページを更新しません。javasriptが苦手なのですが、教えていただけますか?ありがとう!

0 投票する
2 に答える
1242 参照

ruby-on-rails - Rails+ブートストラップ-Sassミックスイン

たぶん私はsassでミックスインを使用する方法、またはbootstrap-sass(https://github.com/thomas-mcdonald/bootstrap-sass)でミックスインを使用する方法を理解していません。しかし、入力フィールドのクラスのボックスシャドウを変更するようなことをどのように行うことができますか?

編集:明確にする必要があります。この例では、アクティブな入力フィールドが選択されているときに、グロー効果を変更しようとしています。デフォルトでは青色です。

私のプロジェクトのセットアップでは、githubページに表示されているとおりに、Gemfileにgemを入れてから、コントローラーに次のようなものを入れます。

だから多分、sassがどのように機能するかについての私の理解はかなり遠いです。入力のボックスシャドウを変更したい場合は、自分のミックスインでコードを繰り返すことができますが、他のミックスインでもこの種のことが可能かどうかについての一般的な質問でもありました。

0 投票する
3 に答える
3247 参照

jquery - bootstrap-datepicker-rails-選択した日付は保持されません

次のgemをインストールし、datepickerを実装しようとしています。日付ピッカーはフィールドに表示されますが、日付を選択すると、データが保持されないか、フィールドに表示されません。私は自分のcoffeescriptまたはhtmlを間違えていますか?それとも、これは宝石間の非互換性である可能性がありますか?

http://www.eyecon.ro/bootstrap-datepicker/

https://github.com/Nerian/bootstrap-datepicker-rails

articles.js.coffeescript

_form.html.erb