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 Component built with SASS

@HosseinHeydarpour

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


Hello everyone :) I would like to share with you my solution to the QR code component challenge from Frontend Mentor. It is a simple yet elegant QR code component that I built using SASS and Flexbox. I used SASS to write cleaner and more modular code, and Flexbox to create the layout. I hope you like it and I appreciate any feedback you may have. Thank you for your time and attention.

Community feedback

Kimo Spark 2,190

@kimodev1990

Posted

You would like to use height : 100 vh in the body element to center your design in the middle of your viewport, Other than that nice work.

Marked as helpful

3

@HosseinHeydarpour

Posted

@kimodev1990 Thank you so much for your feedback. added to my code ❤️

0
Kimo Spark 2,190

@kimodev1990

Posted

@HosseinHeydarpour, You're always welcome

1

@ahmedafsa

Posted

Hello @HosseinHeydarpour, well done!

I'd like to offer a couple of suggestions:

  • I noticed there's a stray end style tag in your HTML code that might need attention.
  • Consider enhancing accessibility by integrating Semantic Elements such as <main>, <section>, or <article> into your code.

Besides these minor points, your work looks excellent!

Marked as helpful

2

@HosseinHeydarpour

Posted

@ahmedafsa Thank you for your nice feedback. Yes right i see it now this is from the internal CSS for footer from the original index.html file. I will defiantly use more semantic elemts in fututre challenges. Thanks for your feedback 👍🏻

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