Foundation-menu-sass-reference

Foundation-メニューSASSリファレンス

変数

表にリストされている次のSASS変数を使用して、コンポーネントのスタイルを変更できます。

Sr.No.	Name & Description	Type	Default Value
1	$menu-margin メニューのマージンを設定します。	Number	0
2	$menu-margin-nested ネストされたメニューの左側のマージンを設定します。	Number	1rem
3	$menu-item-padding 0.7レム1レム	Number	Sets padding in the menu.
4	$menu-icon-spacing メニュー項目のテキストとアイコンの間にスペースを設定します。	Number	0.25rem
5	$menu-expand-max CSSに_expand-n_クラスの最大数を含めます。	Number	6

ミックスイン

ミックスインを使用して、表にリストされているコンポーネントのCSSクラス構造を構築できます。

メニューベース

メニューの基本スタイルが作成されます。

@include menu-base;

メニュー展開

同じ幅でメニュー項目を展開します。

@include menu-expand($count);

Sr.No.	Name & Description	Type	Default Value
1	$count メニュー内のアイテムの数。	Keyword or Number	auto

メニュー方向

メニューの方向が設定されます。

@include menu-direction($dir);

Sr.No.	Name & Description	Type	Default Value
1	$dir メニューの方向を水平または垂直に設定します。	Keyword	horizontal

メニューシンプル

パディングやホバー状態のないシンプルなメニューが作成されます。

@include menu-simple;

メニューネスト

ネストされたメニューにはスタイルが含まれています。 margin-left をメニューに含めます。

@include menu-nested($padding);

Sr.No.	Name & Description	Type	Default Value
1	$padding マージンの長さを設定します。	Keyword or Number	auto

メニューアイコン

アイコンはメニュー項目に含まれています。

@include menu-icons($position, $base);

Sr.No.	Name & Description	Type	Default Value
1	$position アイコンの位置を設定します。	Keyword	side
2	$base 同じ要素でmixinを複数回呼び出すには、falseに設定します。	Boolean	true