Add color picker to change color

Feature request

<Please note by far the quickest way to get a new feature is to file a Pull Request.> <We will consider your request but it may be closed,> <if it's something we're not actively planning to work on> <or it does not match our visison of this software.>

Description

As a color blind person, I want a color picker in the legend, at the metric color settings and at the edge metric settings so that I can choose other color to see the difference between red and green better and so that I can personalize the look of CodeCharta.

Acceptance criteria

Color metric settings:

• for each color (currently green, yellow, red and orange) there is a clickable color icon and a description, what the color represent, under the color range.
• if a user hover over a color icon, a brush icon appears
• if a user select a color icon, a colorpicker opens on the left side (the image shows an example).
• in the colorpicker the user can pick an color or set an hexadecimal color code to change the selected color.
• the color will be updated in the legend once the user has chosen the color
• function white positive buildings is deleted

Edge metric settings:

• for each color there is a clickable color icon and a description, what the color represent, under the height slider.
• if a user hover over a color icon, a brush icon appears
• if a user select a color icon, a colorpicker opens on the left side (the image shows an example).
• in the colorpicker the user can pick an color or set an hexadecimal color code to change the selected color.
• the color will be updated in the legend once the user has chosen the color

Legend:

• each color icon is a clickable icon
• if a user hover over a color icon, a brush pen appears
• if a user select a color icon, a colorpicker opens on the left side (the image shows an example).
• in the colorpicker the user can pick an color or set an hexadecimal color code to change the selected color.
• the color will be updated in the other color settings once the user has chosen the color

Assumptions & Exclusions

The image shows only an example of a colorpicker how it could look. If you find an already developed color picker, which fits to CodeCharta and your code, take it.

[Gaugi28]

@shaman-apprentice I agree too, a good idea!

[BridgeAR]

@shaman-apprentice I agree, especially with the new UI, since we allow to change the colors of the specific range.