Button Group
関連する複数のボタンを角丸を共有するひとかたまりにまとめ、操作の関係性を視覚的に示すコンポーネントです。ジョブアンテナでは検索結果の並び替え(新着/おすすめ)やページ送り、求人カードの応募+いいかも!のようなスプリットボタンに使います。ButtonGroupText でラベルを、ButtonGroupSeparator で区切り線を差し込めます。
基本
outline ボタンの横並び、ButtonGroupText によるラベル付き、orientation="vertical" の縦並びという基本の3構成です。
並び替え
検索結果の並び替え切り替えです。選択中の項目を secondary、それ以外を outline にして現在の並び順を示します。
ページ送り
検索結果のページ送りです。現在ページを secondary + aria-current で示し、省略は ButtonGroupText、端では前後ボタンを disabled にします。
求人カードの操作
応募するといいかも!を ButtonGroupSeparator で仕切ったスプリットボタンです。応募後は両方 disabled にして応募済みを表します。