Frontend Mentor - QR code component solution

This is a solution to the QR code component challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• Overview
  • Screenshot
  • Links
• My process
  • Built with
  • What I learned
  • Continued development
  • Useful resources
• Author
• Acknowledgments

Overview

Screenshot

Desktop

Mobile Phone

Links

• Solution URL: Add solution URL here
• Live Site URL: Add live site URL here

Built with

• Semantic HTML5 markup
• CSS custom properties
• Flexbox

What I learned

<h2>Improve your front-end skills by building projects</h2>
                <p>Scan the QR code to visit Frontend Mentor and take your coding skills to the next level</p>

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;700&display=swap');

Continued development

I would wish to continue to learn how to differentiate the width difference between mobile phone and desktop.

Useful resources

• Example resource 1 - This helped me learn more about google fonts, and also how to apply it to css. I really liked this pattern and will use it going forward.

Author

• Frontend Mentor - @Denil01
• Twitter - @DenilVick1

Acknowledgments

I would like to thank Front Mentor - slack group for offering some assistance.