Frontend Mentor - Order summary component solution

This is a solution to the Order summary component on Frontend Mentor.

Table of contents

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

Overview

Screenshot

Links

• Solution URL: (https://github.com/gmenesesdev/order-summary-component-frontendmentor.io)
• Live Site URL: (https://gmenesesdev.github.io/order-summary-component-frontendmentor.io/)

My process

Built with

• HTML5
• CSS
• Flexbox
• Grid
• Root variables

What I learned

This time I had some difficulty aligning the PLAN section (price, icon and link) correctly. To do this, I had to learn about grid to be able to give it a correct format.

I still need to adjust some details but I have to continue testing and correcting what I am doing.

Continued development

I would like to refine some details, especially regarding the sizes on the different devices. I want everything to be full responsive.

Useful resources

• CSS TRICKS - Grid - This link helps me better understand positioning in grid.

Author

• Frontend Mentor - @gmenesesdev