Input Group
入力欄の前後にアイコン・単位テキスト・ボタンなどのアドオンを組み合わせて、ひとつの入力部品として見せるコンポーネントです。InputGroupAddon の align で inline(左右)と block(上下)の配置を切り替えられます。ジョブアンテナでは求人検索のキーワード入力、希望年収の単位付き入力、企業へのメッセージ入力に使います。
基本
アイコン・ボタン・テキストの各アドオンを inline-start / inline-end に配置した基本の3構成です。
求人検索
検索ボックスです。inline-start に検索アイコンを固定し、入力値があるときだけ inline-end にクリアボタンを表示します。
希望年収
検索条件の希望年収入力です。InputGroupText で単位「万円」を inline-end に添え、下限と上限を並べて範囲を指定します。
メッセージ入力
企業とのメッセージ送信フォームです。InputGroupTextarea に block-start の宛先、block-end の文字数上限と送信ボタンを組み合わせます。