Skip to content

EONRaider/Huddle-Landing-Page

Repository files navigation

Frontend Mentor - Project Name solution

CodeFactor Grade FrontendMentor

This is a solution to the Huddle Landing Page. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

Overview

Screenshot

huddle-landing-page

Links

My process

  1. I started with the markup on index.html, complying with HTML5 semantic tags and standards as much as possible.
  2. The styling provided by the project briefing was implemented first, followed by the classes I came up with on the markup.
  3. I used Figma to acquire all the right dimensions involved in the layout and implemented them in the appropriate CSS classes.
  4. The CSS Cube methodology was used when coding the stylesheet and some of the conventions from BEM were used when naming classes.

Built with

  • Semantic HTML5 markup
  • Cube CSS methodology

What I learned

  • I understood and edited the attributes of an SVG for the first time. There is a significant difference between the files provided by Frontend Mentor and the ones used in the final solutions. Pycharm Pro has a live preview feature that makes this editing a lot easier than when one is limited to browser dev tools.