[FR] UI Improvement for color picker in mobile

[hyj1204]

Description

Currently, the TabBar view of the color picker is just to fix the default color options(8 colors), its height is 3 lines of button height and 4 * button spacing. It used a grid view with 3 items in one row and has a fix height for every row.

However, the color options are a dynamic List, which could be 1 to any size. We need a better way to lay all these items. For example, if the list is too short, the menu can be shorter or every row can have 2 or 3 options depending on its size.

Impact

Better UI to fix different length of color options

Additional Context

No response