This is a solution to the Intro section with dropdown navigation challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Your challenge is to build out this intro section with dropdown navigation 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.
Users should be able to:
- View the relevant dropdown menus on desktop and mobile when interacting with the navigation links
- View the optimal layout for the content depending on their device's screen size
- See hover states for all interactive elements on the page
Created desktop layout, made mobile layout. Setup drawer for mobile layout. Made layouts for dropdowns of desktop and drawers, make functionality for clicking buttons to open dropdowns/drawer. Made functionality for clicks outside of divs to close drawer/dropdowns.
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Mobile-first workflow
- Website - Chris Base
- Frontend Mentor - @chris-base