@emmadumbiSubmitted 5 months ago
Latest solutions
Latest comments
- @AdalbertPunguSubmitted 6 months agoWhat challenges did you encounter, and how did you overcome them?
the challenge I've encountered is that of displaying the icon-view when hovering the mouse and displaying the Cyan color on the card image.
I didn't know where to start, but after reading some articles I realized that you have to use ::after and the rest was a matter of framing the positioning in the image.
- @Alveri-779Submitted 5 months ago
- P@astnioSubmitted 6 months agoWhat are you most proud of, and what would you do differently next time?
This challenge was fun because I got to play with grid a lot more. It is still something I have a difficult time grasping, but I feel much more comfortable with it in general the more I work with it.
One of the challenges I faced was with the mobile menu. As with most of my projects, everything is quite easy until I decide I want to add some animations or transitions.
What challenges did you encounter, and how did you overcome them?I ought to learn a more effective way to create mobile menus. I feel as though my solution for this was not very optimal, yet it isn't very clear to me what an optimal yet simple mobile menu would be.
@skyleranglhPosted 6 months agoGood job, it's quite close to the design. I like the animation on the menu. It's a nice touch. The transition between the icons was also smooth.
I noticed that the nav bar doesn't have spacing above when the viewport is on the desktop, and the navigation content's animation would flicker when adjusting the viewport too. I recommend using relative units for styling font size as absolute units are not quite accessible for those required to zoom in or out of the page. The picture element didn't have a source tag associated with it and the img of it doesn't have an alt tag. The hero title and body lack spacing between them on mobile. Perhaps the articles at the bottom could be broken into two columns on the tablet screen since there are empty spaces. When the menu is active, you could scroll on the body and you could tab to the elements outside the menu. From a user experience perspective, we should take disabling both of these actions into consideration. On the JavaScript side, you could use media queries and do conditional when it's matched. Also, a small note, remember to remove console.log after debugging is finished.
I hope these comments would be helpful. Happy coding.
Marked as helpful1 - @marcosnathanSubmitted 8 months ago
- @MaobugichiSubmitted 6 months ago@skyleranglhPosted 6 months ago
Good job on completing the project. Here are some recommendations that could be implemented.
The main content is not centred responsively. The sections have extra padding/margin around them so they're not lined up with the main heading. There is a little bit too much spacing on the accordion text. You can't navigate anything on the page with tab other than the links at the bottom. Manually setting the inline style for the main element has caused unintended overflowing of the page; too much height. I recommend using relative units (em, rem, %, etc) to style the page as it is not quite responsive. The code needs to be formatted with consistent spacing, and unused variables/console logs need to be removed.
Marked as helpful0
