Skip to content
Submitted over 2 years ago

Responsive design using CSS with SCSS and flexbox

Shravan Kumar•50
@shravankumartalabhaktula
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...QR code component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Hi there,

I'd like to have feedback from you.

  • My design is not mobile friendly for now, I tried my level best to implement the responsiveness for few screen sizes. I'd like to know what all generic screen sizes available and how to target them while developing the mobile first design strategy?
  • Am I following the best practices while writing the scss files?
  • Can you please suggest me where I need to improve and some tips and tricks on how to plan before starting to code.

Thank you so much for your time.

Community feedback

  • Jillian Noreen•60
    @jilliannoreenPosted over 2 years ago

    Looks good! You've done great! You might want to consider adding a box-shadow to further match the design provided. I can’t give much help, especially with the responsiveness, since I'm a beginner myself. All the best for the future challenges, keep up the good work, let's keep learning!

    0
    Shravan Kumar•50
    @shravankumartalabhaktulaPosted over 2 years ago

    @jilliannoreen Thank you so much for your feedback.

    0
  • Axurynn•200
    @AxurynnPosted over 2 years ago

    Good job @shravankumartalabhaktula!

    To fix accessibility issues, you could add a main tag to your HTML file as well as h1 title. About the responsiveness, you could add max-width properties or use @media queries. For example, the min-width you could use in your media queries are 480px for mobile, 767px for tablet and 1280px for desktop.

    Overall, you did well! Congratulations! 😊

    0
    Shravan Kumar•50
    @shravankumartalabhaktulaPosted over 2 years ago

    @Axurynn Thank you for your feedback :) Sure, I will follow your suggestions.

    0

Please log in to post a comment

Log in with GitHub

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