Skip to content
Submitted over 1 year ago

Mobile-first Time Tracker Challenge using NextJS

next
Frida 🌼•90
@FridaWaldt
A solution to the Time tracking dashboard challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

One of the questions I had for this project was if there's a better way to place the images in the banners than I did by using #id for each and adding a background-image? I'd love any feedback really regarding best practices in any capacity, I'm here to learn and improve! Thank you all in advice for being so kind to review my work.

Code

Please log in to post a comment

Log in

Community feedback

  • Mtalafa•350
    @Mtalafa

    Hi, well done on completing this challenge.

    I`m not very good yet with JavaScript but I did have a quick look at your CSS.

    You can add this: transition: all 0.3s; to everything that changes on hovering, like for example the .lastweek

    This will make the transition from the original color to the hover color more smooth.

    Marked as helpful
  • Kenny Ng•400
    @kennylun123

    Hi Frida,

    I hope you're doing well! I wanted to take a moment to congratulate you on completing the coding challenge. Great job! 😊

    I also wanted to provide some feedback on your code:

    Imagine that each of your category-card is a reusable component. Inside of it you just need one div for category-card-stats. And you could set background image to category-card (parent container). You could either set the background using in-line style or assign an id to each component and use CSS selector as you did. After that you can finish the category-card-stats.

    Keep up the great work! I'm looking forward to seeing what you'll create next.

    Best regards,

    Kenny

    Marked as helpful

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