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

Semantic HTML5 markup Flexbox Grid Mobile-fi

P
Kristina 260

@frontend-en

Desktop design screenshot for the Time tracking dashboard coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


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

I'm most proud of getting the closest method right in JavaScript.

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

I was faced with the fact that I was thinking about how best to display cards with data on the screen and filter them, and in the end I chose insertAdjacentHTML

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

I would like to work with code performance

Community feedback

P

@srijanss

Posted

Nice solution.

  • It was very clever to use insertAdjacentHTML to render the cards

  • I will definitely refer to how you have written SCSS for styles, I will try to use it for my next project

  • The solution worked in Chrome. But somehow it didn't show the cards in my Safari. There is some error loading data.json in Safari.

  • And some hover and focus effect on cards were also missing

Happy coding!!

Marked as helpful

0

P
Kristina 260

@frontend-en

Posted

@srijanss thanks Bro!

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