Skip to content
Submitted 3 months ago

responsive article preview component using html css and js

anthony•170
@Codingtry123
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Article preview component
  • HTML
  • CSS
  • JS
1newbie

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

wrap svg inside container simplify the js code

What challenges did you encounter, and how did you overcome them?

how to toggle the share panel add event listened respond to the click event

What specific areas of your project would you like help with?

how do I write media query in js

Community feedback

  • Dirk•210
    @dirkvankriekenPosted 3 months ago

    Hey nice job! Some improvements that could be made: Not all colors match well with the designs (background color and font colors) The spacing between the text blocks (margins/paddings) could be better matching. The share element on small/mobile size could be made so that the size of the containing element does not change on click but remains the same. The answer to your question "how do I write media query in js" is, I think that you can use the window.innerWidth property to check the width of the window in Javascript.

    0

Please log in to post a comment

Log in with GitHub

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