問題タブ [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 投票する
0 に答える
345 参照

compass-sass - コンパスのコンパイル エラー (未定義の mixin "set-legacy-ie-support")

過去 2 日間、sass ファイルのコンパイル中にこのエラーが発生しました。

Compass は、プロジェクト内の 1 つまたは複数のファイルをコンパイルできませんでした:

次のライブラリがインストールされています

このミックスインがどこにあるのか誰か教えてもらえますか? /Library/Ruby で再帰検索を行うと、その名前の mixin はありません。私はそれを理解することはできません。誰かお願いします?

よろしくノーマン

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

susy-compass - Susy: ブレークポイントごとにブロックの順序が異なる?

サイトのヘッダーを次のようにしたいと考えています。

小さい画面では、次のように適応させたいと思います。

これは ZenGrids で簡単に実現できますが、Susy の解決策を思い付くことができません。

Susy's を使用してそれを達成するにはどうすればよいat-breakpointですか?

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

compass-sass - ミックスイン宣言内から添付されたコンテンツブロックに変数を渡しますか?

Rubyでは、メソッド内から添付のコードブロックに変数を簡単に渡すことができます。

SASSミックスインでも同じことをしたいと思います。

$ iはミックスイン宣言の内部で宣言されており、ミックスインが使用されている外部では表示されないため、このコードは機能しません。:(

だから...ミックスイン宣言内で宣言された変数をどのように活用しますか?

グリッドフレームワークとメディアクエリを使用する場合、この機能が非常に必要です。現在、DRYルールに違反して、必要になるたびにミックスイン宣言の内容を複製する必要があります。

UPD 2013-01-24

これが実際の例です。

ブレークポイントを循環し、提供されたコードをブレークポイントごとに1回適用するミックスインがあります。

このミックスインを使用するときは、@content内でこの$bp値を使用する必要があります。これは次のようになります。

ただし、$ bpの値は@content内で使用できないため、これは機能しません。

@contentは一度解析され、ミックスインが解析される前に解析されるため、ミックスインを呼び出す前に変数を宣言しても役に立ちません。

代わりに、私がそれを必要とするたびに、私は2つの醜い太ももをしなければなりません:

  1. アドホックミックスインを宣言し、
  2. DRYの原則に違反して、サイクルを記述します。

だから、問題は:このRubyスタイルを行う方法はありますか?

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

susy-compass - 余白なしの Susy でコンテナーを作成する (Compass/Sass)

body 要素に 8px の余白がありますが、これはナビゲーションが少し奇妙に見えるため、配置したくありません。margin-top を 0 ピクセルに設定するか、ナビゲーションに負の 8 ピクセルのマージンを設定することができます。どちらの方が優れていますが、なぜ Susy はテンプレートにこれを持っているのでしょうか?

ナビゲーションには 8px の上余白があります

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

susy-compass - スージー:構文エラー:未定義の操作:「1/0.623em×1em」

Middlemanappでsusyを使用しようとすると、基本的なセットアップ後に次のエラーが発生します

情報:

_grid.scss

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

css - Susy: 最大ピクセル値に基づく流体グリッド

最大幅でこれらの値を持つ流体グリッドを作成しようとしています:

http://gridcalculator.dk/#/1224/12/40/56

ブラウザーのサイズを 1264 ピクセル未満に変更すると (本体に 20 ピクセルのパディングを許可するため)、すべて (余白、ガター、および列) が比例して縮小されます。これは可能ですか?

私はこれらのアプローチを試しました:

初挑戦:

パディングが 56px に固定され、縮小されないため、これは機能しません。

2 回目の試行:

これはほとんど機能しますが、何らかの理由でグリッドのパディングが列の幅よりも大きくなっています...

私は何が欠けていますか?ありがとう!

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

css - SCSS & Susy: ボックスをグリッド ガターに拡張します。

優れた Susyでグリッドを作成しました。

グリッドにコンテンツのボックスを追加したいと考えています。これを行うと、ボックスがコンテンツと同じグリッドの端に揃えられるため、すべてが窮屈になります。

ボックスにパディングを追加してから、box-sizing: border-box を適用できます。これにより、「窮屈」が解消されますが、コンテンツがグリッドに整列しなくなります。

私が本当にやりたいことは、コンテンツをグリッドに合わせたままにして、ボックスをガターに拡張することです. Susyでこれを行う方法はありますか?

私が何を意味するかを示すために、グラフィックを添付しました。

グラフィック表示問題

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

css - Susyを使用して2つのグリッドアイテムを上下に配置するにはどうすればよいですか?

私はSusyで作成されたCSSグリッドを持っており、2つの側面と次のようなコンテンツセクションがあります。

push()ソースの順序はcontent-1-2ですが、上記はとを使用して十分に簡単pull()です。

狭い画面では、次のように、傍白を互いに上に配置する必要があります。

それらを同じ列に引き込むことはできますが、単純に重なります。どうすればこれを機能させることができますか?

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

ruby-on-rails - Rails 3.2アプリのSass、Compass、Susy

Rails3.2を使用している私のサイトの再設計を開始します。私はすでにSassとCompassを使用していましたが、再設計のためにすべての古いスタイルを破棄し、Susyをミックスに追加したいと考えています。始める前に、物事がどのように機能するかについての簡単な質問:

私はちょうど追加しました:config.compass.preferred_syntax :sassの私のapplication.rbファイルに/config、これは正しいですか?このファイルは、標準のコンパスプロジェクトapplication.rbの通常の構成ファイルの代わりになりますか?compass.rb

私が追加した行は、予想される構文を、私が非常に好むsassインデントされた構文に明らかに変更しますが、その行は、私が好きな構文をコンパスに伝えているようです。コンパスは現在、sassではなくcssのコンパイルを行っていますか?また、sassのドキュメントを読んで、好みの構文を教えてくれます。両方を設定する必要がありますか?何がどのような機能を果たしているのかよくわかりません!

私も追加gem "susy"しましたが、追加するGemfile必要がありますか?config.compass.require "susy"/config/application.rb

また、fonts_dirを設定したい場合、Compass docsには、Railsアプリのデフォルトではデフォルトになると記載されていますpublic/fontsが、それらをに入れたいと思います/app/assets/fonts。それは機能しますか?

コンパスドキュメントから:

文字列フォントファイルが保存されるディレクトリ。スタンドアロンプ​​ロジェクトはデフォルトで/fontsになります。Railsプロジェクトはデフォルトで「public/fonts」になります。

人々が私のためにこれらの問題にいくらかの光を当てることができることを願っています。