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

Expense card component with react and tailwind

#react#tailwind-css

@Igwe0001

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 front-end community, I just finished working on this challenge with react and tailwind and I would really love your feedbacks. Thank :)

Community feedback

@miranlegin

Posted

Hi Nwobodo,

congratulations on completing this challenge!

Overall you did a great job and it seems to me that everything is working like it should.

I've found one thing that i think you can improve regarding price bubble that slides up when you hover over the columns.

If you inspect this element in the dev tools and apply this 2 properties you will see for yourself.

visibility: visible; opacity: 1;

The issue is when you are hovering over the columns price bubble is interfering with your mouse cursor and animation have some glitchy thing going on. I suggest that you move price bubble on the top side even slightly over the column bars and animate it below. Other that that great job!

Keep coding! Cheers, Miran

Marked as helpful

1

@Igwe0001

Posted

@miranlegin Thank you very much. I'll work on it.

0

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