Responsive page using CSS Flex layout , interactive using vanilla Js!
Design comparison
Solution retrospective
Seem simple at first glance, but there plenty of challenging patterns for a junior web developer. Completing this challenge helped become more familiar with different subjects both in CSS and Js. That little arrow on the bottom of pop-up share container and also moving it to overlap the flex layout was quite a challenge for me. organizing media query properties along with avoiding duplication also was new to me. Although needed functions in JS were almost simple, still listening to media queries in Js and using matches() window.matchMedia() came in handy to observe resizing the window was quite a struggle. all in all happy to complete this challenge, big thanks to frontendMentor for these informative hand-on practice projects. I know that I might used some stupid hard-coded solutions for some parts, I 'll be more than happy to hear your alternative solutions in comments.
Community feedback
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