Solution : Live Site URL
This is a solution to the Project tracking intro component challenge on Frontend Mentor.
Your challenge is to build out this intro component and get it looking as close to the design as possible.
You can use any tools you like to help you complete the challenge. So if you've got something you'd like to practice, feel free to give it a go.
Your 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
- Create the background shape using code
- HTML
- CSS
- CSS Flexbox
- JavaScript
Simple layout but had some tricky elements like the background blue pattern behind the illustration which spreads to the top navbar. It positioned well at the end but the way its done is not very smart. I struggled with a lot of small things. Illustration position is done in not so elegant way either which makes it fit itself to the canvas at various different proportions in varied screen sizes. The JS for the navbar is incomplete.
- Complete the JavaScript for the navbar.
- Redo this challenge with a different layout structure to make a very responsive page through various devices.
- Live solution screenshot(s)
- Submit to frontendmentor and add Solution submitted at Frontend Mentor - Submission link