Submitted about 1 month ago

Expense Chart

accessibility, tailwind-css, web-components, webflow, webpack

Caleb Abuul•320

@Caleb-Abuul

A solution to the Expenses chart component challenge

Preview Code

Solution retrospective

What are you most proud of, and what would you do differently next time?

I am most proud of using a mobile-first workflow. It made my life a lot easier and my design more responsive. From now on, I will implement a mobile-first workflow in all my projects.

What challenges did you encounter, and how did you overcome them?

The most challenging part of the project was designing the bar chart. This part really took a toll on me. But my knowledge of flexbox and grid layout came in handy. And I am grateful that I had learnt it earlier. Though there may be a better way of doing it.

What specific areas of your project would you like help with?

I designed the bar chart using a grid layout. If there is a better way of designing charts in HTML, CSS, or JavaScript, don't hesitate to let me know in the comments. Thank you.

Code

Please log in to post a comment

Community feedback

No feedback yet. Be the first to give feedback on Caleb Abuul's solution.

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