Foundation-progress-sass-reference

Foundation-プログレスバーSASSリファレンス

説明

SASSリファレンスを使用して、コンポーネントのスタイルを変更できます。

変数

次の表に、このコンポーネントのデフォルトスタイルをカスタマイズできるようにするプロジェクトの設定ファイル内のSASS変数を示します。

Sr.No.	Name & Description	Type	Default Value
1	$progress-height プログレスバーの高さを表します。	Number	1rem
2	$progress-background プログレスバーの背景色を表します。	Color	$medium-gray
3	$progress-margin-bottom プログレスバーの下マージンを表します。	Number	$global-margin
4	$progress-meter-background プログレスバーのメーターのデフォルト色を表します。	Color	$primary-color
5	$progress-radius デフォルトの進行状況バーの半径を表します。	Number	$global-radius

ミックスイン

このコンポーネントの最終的なCSS出力を構築するには、次のミックスインを使用できます。 Foundationコンポーネントを使用して独自のクラス構造を構築するには、mixinを自分で使用できます。

進捗コンテナ

@include progress-container;

プログレスバーのコンテナにスタイルを追加します。

プログレスメーター

@include progress-meter;

プログレスバーの内部メーターにスタイルを追加します。

プログレスメーターテキスト

@include progress-meter-text;

進行状況バーのメーターのテキストにスタイルを追加します。