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.
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
- Vite
- React
- css grid
- flexBox
I learned how to change the hero image source depending on the device width. Also I have never done a collapsable side bar from scratch, which was really neat. This project helped me understand the css functions clamp and calc a bit better, which I will use more in the future.
I want to learn more on how to use and change svgs in the layout as well as use more transitions on collapsable elements.