/Summary-Result

Repository for the solution of "Summary Result" challenge by Frontend Mentor

Primary LanguageCSS

Frontend Mentor - Results summary component solution

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

Table of contents

Note: Delete this note and update the table of contents based on what sections you keep.

Overview

The challenge

Users should be able to:

  • View the optimal layout for the interface depending on their device's screen size
  • See hover and focus states for all interactive elements on the page

Links

My process

Built with

  • Semantic HTML5 markup
  • CSS custom properties
  • Flexbox
  • CSS Grid

What I learned

I used this project to learn how to built responsive layouts from scratch and with pure technologies. I was used to take too long to make even the easiest of easiest layouts, and I am taking a time to make challenges from Frontend Mentor to develop more "fluency" and be a bit faster in building layouts.

With this project I was able to learn more about HSL, which before I never have thought about using it, just the common rgb, rgba and hex.

Greatful about friends and contacts, I was also able of learning more about best practices and performances, and I am still improving the code of this project constantly by the means of getting better everyday.

Continued development

I will be doing my best to improve in means of best practices, accessibility and performance.

Useful resources

  • Adobe Colors - With this website I was able to pick up colors which I was in doubt.

Author

)

Acknowledgments

I am very greatful and pleased with every friend I have for motivating and helping me everyday. I am also greateful with Frontend Mentor community for the free challenges provided, where I can sharp my frontend skills.