This is a solution to the Loopstudios 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/LidiaRJ/loop-studios-landingpage)
- Live Site URL: (https://lidiarj.github.io/loop-studios-landingpage/)
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Mobile-first workflow
- Sass
- Implementing Sass and nesting child elements within the parent elements.
- I got a better understandin of how to use sass and the many possibilities it offers, like reducing the amount of code.
I want to continue focusing on learning sass in depth, and applying media queries using mixins, @use and @import.
- (https://www.youtube.com/watch?v=roywYSEPSvc) - This helped me to understand sass better and how to use it. I found this resource after I styled my html code though.
- Website - Lidia Ruiz Jimeno
- Frontend Mentor - @LidiaRJ
- Github - @LidiaRJ
- Codepen - (https://codepen.io/lilyrj)