Design comparison
Solution retrospective
I'm proud of having organized myself well before starting to write any lines of code. In Figma itself, I've already separated the sections for each screen size and planned out how the classes would adapt, especially for desktop. I've also been pleased with how I'm adapting to Sass and its folder structure to keep projects more organized. Finally, I'm happy with the end result, which stayed very true to the design.
What challenges did you encounter, and how did you overcome them?The biggest challenge was with the hero images, which behave differently as we open the screen size. Creating a logic to structure this in a way that would be easy to code for all sizes was the icing on the cake.
Community feedback
- @sivaprasath2004Posted 7 months ago
Hello i`ll wishing for your completion project solution.
- I will give some suggestion i believe its used for improve your skill.
- In CSS You will use
@media (min-width: 768px) { .hero { margin-bottom: 80px; } }
- I will recomand for Using
rem
orem
values forpadding
andmargin
provides a scalable and flexible approach, especially when considering accessibility and responsive design. - change to
@media (min-width: 768px) { .hero { margin-bottom: 8rem; } }
1@DiogoLuxaPosted 7 months ago@sivaprasath2004
Hey, Bro!
Thks for sharing, but I used px only for the show and simplicity, in the real world I would use rem. ^^
0@0xabdulkhaliqPosted 7 months ago@DiogoLuxa, There's no such thing as "real world", building projects on Frontend Mentor is mainly because to gain Professional experience not for just showcasing our work.
I would greatly suggest you to use
rem
, just try that's what makes you a better developer!0@DiogoLuxaPosted 7 months ago@0xabdulkhalid
Rsss Bro, I really appreciate the comment. Let's have some fun and take it easy ;)
0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord