BUG: Progress chart UI/UX issues

[Olena-Olenka]

Describe your issue

• Colors of text in Canvas element of chart looks different from other texts in the component - Goal Progress label and options of dropdown
• Full names of weekdays and month are used so that it is difficult for user to properly assosiate group of bars (e.g. for each day) and it's name when screen width is less 919px and names change orientation to diagonal
• Distance between groups of bars (e.g. for each day) in the graph is too small to be easily distinguished by the user

Steps to reproduce

1. Open https://live-in-motion-everyday.com/sign-in, login with valid credentials.
2. Being on the Home page, pay attention to the Goal Progress chart and it's elements

What was the actual result?

• Colors of text in Canvas element of chart looks different from other texts in the component - Goal Progress label and options of dropdown
• Full names of weekdays and month are used so that it is difficult for user to properly assosiate group of bars (e.g. for each day) and it's name when names change orientation to diagonal - screen width is less 919px
• Distance between groups of bars (e.g. for each day) in the graph is too small to be easily distinguished by the user

What was the expected result?

• Colors of text in Canvas element looks the same as other texts in the component - Goal Progress label and options of dropdown
• Abbreviated names of weekdays and month are used, so that user can easily assosiate group of bars (e.g. for each day) and it's name when names change orientation to diagonal
• Distance between groups of bars (e.g. for each day) in the graph is large enough, so that these groups can be easily distinguished by the user

Put here any screenshots or videos (optional)

What OS are you seeing the problem on?

Windows

What browsers are you seeing the problem on?

Chrome

Severity

Minor (S4)

[Olena-Olenka]

These issues may be handeled in 286. Issue with adaptiveness excluded here, because it is included in 286

[Olena-Olenka]

Resolved with #286