Frontend Mentor - Sunnyside agency landing page solution

This is a solution to the Sunnyside agency landing page challenge on Frontend Mentor.

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
• My process
  • Built with
  • What we practiced
  • Continued development
  • Useful resources
• Authors
• Acknowledgments

Overview

The challenge

Users should be able to:

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

Screenshot

Links

• Solution URL: Sunnyside_agency_landing_page
• Live Site URL: Sunnyside_agency_landing_page

My process

Collab project was created by josh76543210, Abdoulaye33, darionas from Frontend Mentor.

• Create drawing from design (structure of design)
• Create of repo
• Create HTML layout
• Create CSS layout according style guides
• Create layout for mobile first
• Craete layout for desktop
• Implement JavaScript

For RWD were used different techniques: flex, grid, media query, cause of coders experience.

Built with

• Semantic HTML5 markup
• CSS custom properties:
  • Flex
  • CSS Grid
  • Media query
• JavaScript

But created with ❤️

What we practiced

Hey, we practiced collab on GitHub platform. As we have different experience we have used different techniques in css to achieve RWD: flex, grid, media query. And we succeded. Thank you josh76543210, Abdoulaye33 for collab.

Continued development

Continue collab on GitHub platform.

Useful resources

None

Authors

• Frontend Mentor - @josh76543210

• Frontend Mentor - @Abdoulaye

• Frontend Mentor - @Darionas

Acknowledgments

• Thank you Frontend Mentor team for opportunity to try, practice, train yourself in different level challenges and gain invaluable experience.