Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Responsive Article Preview Component - HTML, SASS, JS

Bel Sahn 440

@BelumS

Desktop design screenshot for the Article preview component coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hi everyone, this is my first JS challenge in a while. My main issue was the active state for desktop.

  • I found a solution using JS media queries, but I wonder if that was too much logic?

Thanks,

Bel

Community feedback

Elaine 11,400

@elaineleung

Posted

Hi Bel, great job completing this challenge! 🙂 I'm looking at this on my laptop and I can't see the desktop version at all (my screen goes to right below 1300px). I think you can try a smaller breakpoint, as this component really isn't that big and won't need to take up that much space.

About your question regarding the logic, I would say yes, it is a lot! But if you can get it working, then that's great, and then next thing then is to figure out how to refactor or even to do things differently. I also used some JS in my solution, but it's only for toggling classes and so the script is minimal. Anyway, you can check it out as a comparison to see how else this challenge can be done: https://www.frontendmentor.io/solutions/responsive-article-preview-component-hb8e6pLuv

Great work on the whole!

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join 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