Article preview component

Solution retrospective
I feel like I was able to get the style very close to the design. I paid close attention to small spacing and sizing details.
What challenges did you encounter, and how did you overcome them?Learning how to properly position the button popup and getting to apply the onclick event were the most challenging parts of the project. I was able to learn a lot about how positioning works and do a little bit of limit testing on DOM manipulation.
What specific areas of your project would you like help with?For this challenge, my biggest issue was not being able to only have one on-click button. In my solution, I ended up doing a band-aid solution with two different buttons (original button and the popup button) which I never really resolved, partially because I started this assignment a few months ago and wanted to keep what I had initially to get properly critiqued. Any suggestions or pointers on a different approach would be a big help!
As usual, any suggestions on changing/improving naming philosophies such as how to properly apply BEM to my HTML and structuring would also be greatly appreciated.
Please log in to post a comment
Log in with GitHubCommunity feedback
- @asthaaaaa07
Hi there! 👋
First off, I just want to say that this is a beautifully structured and clean solution. The layout looks great across screen sizes, and your use of BEM conventions, CSS variables, and media queries is really solid — great job! 👏
That said, I noticed a small issue worth fixing: In your CSS, the font-family is currently written as: font-family: 'Maonrope', sans-serif; However, the correct font name (as loaded from Google Fonts) is: font-family: 'Manrope', sans-serif; Just a tiny typo, but correcting it will ensure your font loads and displays as intended. 😊
Marked as helpful
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