feat: [0797] コードの整理、カラーグループを5から10に拡張

[cwtickle]

🔨 変更内容 / Details of Changes

1. 共通系のコードを関数化して整理しました。
2. カラーグループ数を5から10に拡張しました。
3. 一時的に変更できるシャッフルグループ番号を10から20に変更しました。
4. カラーピッカーで設定した色をリセットするボタンを追加しました。
5. シャッフルグループ・カラーグループの説明文の位置を変更しました。

🔖 関連Issue, 変更理由 / Related Issues, Reason for Changes

1. 今後、機能追加時に拡張しやすくするため。
2. 従来の5種類だけでは足りない可能性があるため。
   なお、色変化でカラーグループ6～10を使うには ncolor_data を使う必要があります。
   また、カラーピッカーは場所の関係があり5個ずつの設定になります。
   6個以降は[1 /]のボタンで切り替えます。
   Arrowの横にある[↓]ボタンについてはこれまで通り
   カラーグループ全ての設定をフリーズアロー矢印・帯へ適用します。
3. 従来の10種類では足りない可能性があるため。
4. カラーピッカーで設定した色を戻す機能が存在しないため。
5. このメッセージだけ他と位置が異なるため。
   なお、この変更に伴いキーコンフィグ本体の位置を17px下にずらしています。

📷 スクリーンショット / Screenshot

📝 その他コメント / Other Comments

[codeclimate]

Code Climate has analyzed commit bbeb591 and detected 0 issues on this pull request.

View more on Code Climate.