This is a solution to the Insure landing page challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
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
- Solution URL: https://github.com/frontendstu/insure-landing-page
- Live Site URL: https://frontendstu.github.io/insure-landing-page/
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Mobile-first workflow
- Sass
This was a good refresher project for me after taking some time away from frontend development. I found a couple of elements a bit tricky to remember, but they came back to me after awhile.
I struggled a fair bit with the patterns within the hero. I found that using the ::before and ::after pseudo-elements helped to position the left pattern (::before) and the right pattern (::after). I probably failed on this and it is something that I should be focusing my learning as I do struggle a bit with patterns in most of the Frontend Mentor challenges.
- Frontend Mentor - @frontendstu
- Github - https://github.com/frontendstu/