Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Chart component with Chart-js

#chart-js
dportillo23โ€ข 260

@dportillo23

Desktop design screenshot for the Expenses chart component coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hi,

I tried to keep the layout as close as I could to the original.

Please let me know about any feedback.

Happy coding :)

Community feedback

amine takdentiโ€ข 330

@aminetakdenti

Posted

and about the cyan color I think you should give it to the max value

0

dportillo23โ€ข 260

@dportillo23

Posted

@aminetakdenti Thank you for your feedback. The challenge asked for:

See the current day's bar highlighted in a different colour to the other bars

That is why I used it to highlight the current day instead of max value

0
amine takdentiโ€ข 330

@aminetakdenti

Posted

@dportillo23 cool then๐Ÿ˜๐Ÿ˜

0
amine takdentiโ€ข 330

@aminetakdenti

Posted

man you really did well, I really like the animation๐Ÿ‘Œ๐Ÿ‘Œ๐Ÿ‘Œ

0

dportillo23โ€ข 260

@dportillo23

Posted

@aminetakdenti Thank you very much, Chart-js actually handles the animation by default, and it's very easy to setup, if you try this challenge, check that out

1

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord