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

Project tracking intro component

Bazzβ€’ 165

@Basit-Dev

Desktop design screenshot for the Project tracking intro component coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Found this one a bit tricky, more so with positioning the image. Is there another way I seem to be repeating the code for mobile queries? Thanks

Community feedback

P
ApplePieGiraffeβ€’ 30,565

@ApplePieGiraffe

Posted

Hey, Bazz! πŸ‘‹

Good job! πŸ™Œ

Your solution looks pretty good and responds well! πŸ‘

I suggest,

  • Adding a hover state to the button on the page.
  • Setting cursor to pointer for the hamburger menu in the mobile layout of the site.
  • My suggestion for media queries would beβ€”next time, perhaps try using media queries only using min-width rather than max-width. It'll help you think about designing for mobile screens first and also load fewer styles for small screens. You still have to write a couple of styles again in order to redefine their values for the desktop layout, but that's to be expected!

Keep coding (and happy coding, too)! 😁

0

Bazzβ€’ 165

@Basit-Dev

Posted

@ApplePieGiraffe thank you, keep forgetting to add hover states . Thank you for the feedback! 😊

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