Skip to content
Submitted about 3 years ago

Expenses-chart-component

sass/scss, bem
Kent O'Sullivan•1,870
@12Kentos
A solution to the Expenses chart component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Hey Everyone,

Sorry my files are a complete mess, this challenge taught me that I really, really need to organize my files better. :P

I did have one question, I was unable to figure out how to set the height of the bars with the animation, which is why the animation goes to 100% than jumps down to where the height is actually at. Hope that makes sense, and any help with this would be great.

Thanks!

Code

Please log in to post a comment

Log in

Community feedback

  • Rian Mendes•100
    @devrianmendes

    I set the height of the bar by taking the day value in the .json document and multiplying it by 2.5, so all the values ​​in the document multiplied by 2.5 would give less than 200px height for each bar, even if the value changed later, the height of the bars would change according to the new values. If it was difficult to understand, take a look at my github in the challenge repository and look at the handleBar function.

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