Resposnive Article Preview Component

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

I’m most proud of successfully implementing a solution using JavaScript, especially considering I had no prior experience with it. It was a challenge, but I managed to navigate through troubleshooting and extensive reading to find my way. This experience boosted my confidence in problem-solving.

If I were to do things differently next time, I would spend more time planning the project structure and breaking down the tasks before diving into coding.

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

I encountered several challenges during the project, particularly when it came to making containers appear and disappear as needed, as well as implementing overlays. Initially, I struggled with understanding how to manage the visibility of these elements dynamically.

To overcome these challenges, I focused on adding new elements and experimenting with their display properties. I learned to use JavaScript to manipulate the DOM, which allowed me to toggle the display of containers and overlays effectively. By troubleshooting and testing different approaches, I gradually figured out how to achieve the desired functionality.

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

I’d like to get some guidance on managing the display properties of buttons in my project, particularly in the horizontal layout. I encountered an issue where the display function of the button forces display: flex over the media query, which complicates things. Since I used an SVG for the button, it didn’t respond to CSS color properties as expected, leading me to create a separate button for the active version.

While I considered making a completely different profile container with a new button for the horizontal layout, that feels unnecessarily complicated. I’d like to know if there’s a more efficient way to handle the display and styling of the button without resorting to duplicating elements. Any tips on how to manage this within the media queries or alternative approaches to styling SVGs would be greatly appreciated!