ステップナビ未リファクタリング

1. フォーム入力

   必須項目全てに入力してください

2. 入力内容確認

   間違いがないか確認してください
   OKであれば送信します

3. フォーム送信完了

   ありがとうございます
   数日以内にお返事します

クラス名

bl_stepper

マークアップ例

<ol class="bl_stepper">
	<li class="bl_stepper_item"><!-- is_current or is_done -->
		<div class="bl_stepper_item_body">
			<h3 class="bl_stepper_ttl">項目タイトル</h3>
			<p class="bl_stepper_desc">概要</p>
		</div>
	</li>
	<!-- 3〜5ステップ推奨 -->
</ol>
<!-- /.bl_stepper -->

定義

機能
フォームや登録手順などで、全ての工程の今どこにいるかを示す。
3〜5ぐらいの工程が望ましい。
is_current : 現在のステップを示す
is_done : 終了したステップを示す

あしらい・振る舞い
スマホの時には上から下に流れ、iPad横以上になれば横並びになり左から右へ進む。
現在地にはキーカラーでハイライト、その他は静かに。
終了したものは数字をチェックに変える。

特記事項
マークアップ時は<ol>タグ想定

ファイルパス

Change Log

1. 開発開始：2021-09-18
2. 2021-09-19 IE11対応含めリファクタリング不足
3. 最終更新：2021-09-20