Redesign the color picker for labels and color widget

What does this MR do and why?

This MR is part of FE: Work Items - visualize records using colors (#394864 - closed) and delivers the redesigning of color picker component for Color widget on work item Epic and Label widget on issues and epics.

Link to the UX design: https://www.figma.com/file/494ivARv2dGm6h4DOIhfbB/Work-Items-%E2%80%93-Detail-Page?type=design&node-id=5528%3A210429&mode=design&t=5CLnseIdKj7PhYTO-1

Following things are covered as part of the redesigning:

• Color palette can be customised from the parent component
• Spacing changes as per the new UX
• Clicking on any palette will update the color (Not for Label widget)
• Show error message if invalid hex code is provided as shown in UX (Not for Label widget)

MR acceptance checklist

Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Screenshots or screen recordings

Before	After
Screen Recording 2024-02-22 at 7.59.26 PM.mov	Screen Recording 2024-02-28 at 3.01.00 PM.mov

How to set up and validate locally

Prerequisites:

1. Enable the OKRs feature as mentioned in the OKRs docs (e.g. ::Feature.enabled?(:okrs_mvc, Project.find(<PROJECT_ID>)) and the namespace must have Ultimate plan).
2. Enable Epic work items FF - Feature.enable(:namespace_level_work_items)
3. Enable the FF to view the Edit pattern - Feature.enable(:work_item_mvc_2)

Steps to verify:

For work item epic Color widget:

1. Login with any user
2. Go to any Group > Epic
3. Change the URL from /epics to /work_items e.g. http://127.0.0.1:3000/groups/gitlab-org/-/epics > http://127.0.0.1:3000/groups/gitlab-org/-/work_items
4. Create an new Epic work item
5. Go to the Epic work item detail page
6. Interact with the Color widget

In addition to above flow, it also affects the Issues Label widget

For Issues Label widget:

1. Create an Issue from Group > Project > Issues
2. Open the Issue
3. Edit the Label widget on the right sidebar
4. Click on Create project label
5. Verify if the color selection for label is working well

For Epic Label widget:

1. Login with any user
2. Go to any Group > Epics
3. Create an Epic
4. Go to Epic detail page
5. Edit the Label widget on the right sidebar
6. Click on Create group label
7. Verify if the color selection for label is working well

Related to #394864 (closed)