Frontend Mentor - Huddle landing page with alternating feature blocks solution

This is a solution to the Huddle landing page with alternating feature blocks challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
• My process
  • Built with
  • What I learned
  • Continued development
  • Useful resources
• Author
• 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: Github
• Live Site URL: Vercel

My process

Built with

• Semantic HTML5 markup
• CSS custom properties
• Flexbox
• CSS Grid
• Mobile-first workflow

What I learned

I learned how to change the color of SVG images using the internal code and how to position certain elements in a specific location on the page.

Continued development

I'd like to continue working with the svg images as well as having elements of the website that need to be moved with the position properties.

Useful resources

• Stack Overflow - A comment on this thread was helpful in helping me learn how to change the color of an svg image.

Author

• Github - @laceeder
• Frontend Mentor - @laceeder