問題タブ [susy-compass]

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 投票する
1 に答える
958 参照

ruby-on-rails - コンパス プラグイン Susy が見つかりません

Rails 4 アプリを実行していて、コンパスと susy を実行しようとしています。次のエラーが表示されます。

私のgemfileグループ:

私が持っている唯一のCSS行(_base.sass)

Bundle Install を実行しましたが、アプリは以下を使用しています。

完全に失われました。私はコンパス用の config.rb ファイルを持っていませんが、Rails 3.1/3.2 以降では必要ありません。何か案は?

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

susy-compass - Susy at-breakpoint()とデバイスオリエンテーションメディアクエリの組み合わせ

私はスージーでレスポンシブデザインに比較的慣れていません。グリッドを設定し、at-breakpoint()を使用して、最初にブラウザウィンドウのサイズを変更しながらページをテストし、次に実際のモバイルデバイス(電話とタブレット)でテストすることで、ページを完全にレスポンシブにしました。 。メディアクエリに追加の方向ルール(方向:横向き)が必要なため、iPadで問題が発生しました。ここでの回避策は何ですか、それをブレークポイントルールに含める方法はありますか、それともこの場合のために別のメディアクエリを作成する必要がありますか?

これが私のグリッド設定です:

そして、サイドバーとページ本文を扱うときは、最初にそれらをブロック要素として表示してページ全体を水平方向に塗りつぶし、ブレークポイントの後、次のように列として表示します。

ブレークポイントの変数を保持し、方向ルールを追加するようにコードを変更するにはどうすればよいですか?ありがとう!

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

susy-compass - susy グリッド背景表示

susy-grid-background mixin でグリッドを表示できません。グリッド関連の変数を true に設定し、グリッドの色を指定しましたが、何をしてもグリッドが表示されません。

Susy の Web サイトからデモ コードを実行すると、グリッドは期待どおりに表示されます。私は何が欠けていますか?

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

ruby-on-rails - Susy ネストされたグリッド

Susy グリッドを作成し、それを複雑なネストされたナビゲーションに使用しようとしています。私が抱えている問題は、ヘッダー (ナビゲーションで作業しているタグ) のスコープに 0em $gutter-width を設定したいのですが、ページの残りの部分では 1em のガターを設定したいということです。 . 私のナビゲーション バーは 100% の画面幅で、理想的には 10 進数の列をスムーズに処理できます。

これが私が取り組んでいるものです:

ヘッダ

ミックスイン (horizo​​ntal_ul_structure): 現在、ネスティングはうまく機能しており、ホバー UL は 100% 幅にする必要があります。したがって、1列のコンテキストで12列にしています。

ここで、私が取り組んでいるアンカータグのハックに気付いた場合、基本的にアンカータグをli要素を少し超えて拡張して、私が機能しないガターを防ぎます。

このガター幅を取り除き、アプリケーションの別の部分に別のグリッドを作成する方法はありますか?

とにかく、susy config の名前空間を指定する方法はありますか?

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

susy-compass - Mixin "with-grid-settings" はコンテンツ ブロックを受け入れません

Mixin "with-grid-settings" はコンテンツ ブロックを受け入れません。

これを解決しようとして、それについて検索しましたが、情報が見つかりません。

ありがとう、イリア

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

css - Susy: オメガとレスポンシブ グリッド

Susy を使用する場合、行の最後の項目に「オメガ」フラグを付けて、そのmargin-right. たとえば、12 列のグリッドに配置する必要があるアイテムがたくさんあるとします。

そしてSCSS:

しかし、私たちのグリッドはレスポンシブで、小さいディスプレイでは 8 列のグリッドを使用しています。問題は、 ではなくomegaに表示する必要があることです。2n3n

私の質問は次のとおりです。スージーでは、ブレークポイントごとに列を再定義する必要がありますか、それとも列幅を一度だけ定義してomega自然に適切な場所に配置する方法はありますか?

そうでない場合、それを提供する他のグリッド システムはありますか?

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

sass - Susy でオメガを使用して 4 列から 3 列に変更すると失敗する

これは確かにいくつかのコードで示すのが最も簡単です:

最初は 4 列で 4 番目がオメガで、次に 3 列に変更し、3 番目がオメガです。正しい要素は左右に正しくフロートされますが、4 番目ごとに間違った右マージンが取得されます...

私はこれを正しく行っていますか?むしろ、私は何を間違っていますか?

読んでくれてありがとう /アンディ