This is a solution to the Manage landing page challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Note: Delete this note and update the table of contents based on what sections you keep.
Found this project on Kevin Powell's Youtube channel and thought it would be a great page to learn from as I have not built a full page like this with background elements.
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
- See all testimonials in a horizontal slider
- Receive an error message when the newsletter sign up
form
is submitted if:- The
input
field is empty - The email address is not formatted correctly
- The
- Solution URL: Add solution URL here
For this I followed along a tutorial to understand how to set up the basic webpage. I learned to start with utility classes and how to get things in place so it helps layout a page and duplicate it later on.
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Mobile-first workflow
The importance of utility classes and working with pseudo styles.
- Example resource 1 - This is the playlist I followed along and have learned alot to use in the future.