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

Article-Preview-Component-Master

@thedanielking

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


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

I proud I was able to understand this code very well and found my way of fixing the problem without following any youtube tutorial on this.

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

I couldn't find a way to assign different functions to the same button at the same time until I did everything a developer should do i.e researching and i learnt about using an iterator for the button onclick.

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

I have challenge in the solution i found. I works well on the bigger screen but on a small screen you need to click the button twice before it changes due to the condition i give the button to satisfy the big screens.

Community feedback

@dimitrisdr

Posted

Nice work! It is really close to the identical! I think that it would be very helpful to apply some transitions to your buttons for changing the colors. This would lead to a better user experience! Also you should consider applying position relative to a parent of your pop up in order to gain much control over it for better position. If I understand correctly .traingle is for the bottom arrow of your pop up. You can achieve the same result by using ::after class for your share container! Congratulations!

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