Frontend Mentor - QR code component solution

Table of contents

• Screenshot
• Links
• My process
  • Continued development
  • Useful resources
• Author
• Acknowledgments

Screenshot

Links

• Solution URL: Frontend Mentor Solution
• Live Site URL: https://dellannie.github.io/qr-code-component-main/

My process

This was fun and simple. I didn't use any special CSS feature to complete this task. My reson for this is I was just trying to show off how the web is already responsive wihtout anything added to the code. CSS is amazing and I beleive that 99% of builds on the web need to stat with mobile first becuase the web is already responsive.

Built with

• Semantic HTML5 markup
• CSS custom properties

This has become one of my favporite thing to do so far in CSS. I'm not sure why but learning CSS before I used to use the link. Now I find myself using Font-Face a lot more and its easier to use for me.

@font-face {
    font-family: 'outfit';
    src: url('assets/Outfit/Outfit-Regular.woff2') format('woff'),
    url('assets/Outfit/Outfit-Bold.woff2') format('woff2');
}

Useful resources

• Cloud Convert - This is a cool resource for anyone who use font-face and would like to convert ttf files to woff2 font.

Author

• Frontend Mentor - @dellannie
• Twitter - @Whatzupcorey