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

QR Code Component

@leocsdev

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


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

If I recall it correctly, I just eyeballed the design. Not really looked into the design file. Which is I'm proud. But it's better to build the challenge with the design.

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

Not much since I have some background on how to convert the design to html/css

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

JavaScript, diving deep into it.

Community feedback

@joaskr

Posted

Hi :) Good job with the solution! It looks just like the design! Here are some minor suggestions if you want to improve your code :)

Accessibility

  • You should use HTML landmark elements such as <header><nav><main><footer> because they improve accessibility. In your code you can change <section class="container"> to <main class="container">

Visual aspect

  • I noticed a small bug in your solution. When you open the site on mobile in landscape mode the design gets a little bit broken. You might want to look into that.

Code

  • You are using px in your project. As per the responsive design best practices you should use rem and em. Here's a nice blog post explaining them.

Overall, great job! Let me know if you have any questions

Keep coding and good luck with future challenges!

Marked as helpful

1

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