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

My first Junior project, i think i made it well :>

Radek 230

@RadeQu

Desktop design screenshot for the Intro section with dropdown navigation coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Any advices is welcome ! :)

Community feedback

@GrzywN

Posted

Hey, well done @RadeQu!

I can suggest you to put empty links instead of paragraphs (Careers, About, Login) and add hover states to them, it can be easily done by using href="#" in the <a> tag.

Also, I think it's worth to improve your mobile navigation UI/UX. Things which are worth improving:

  • Fixing animations, so they appear always, not only when you close the menu. (change the place of transitions/animations properties which are in :hover to hover state element selectors)
  • Making hamburger menu up top and appear in the same place as before opening the menu. Consider using z-index property (it cannot be opened and closed with the same position of the mouse cursor)
  • Check your website using Tab key. Some weird things happen like the menu appearing on the right side of the screen, unexpected overflow which is hidden (navigation and scroll doesn't work). It's good to make user able to navigate your website/app with only keyboard without any problems by pressing tab and enter. You can sometimes use pointer-events: none in situations like this.
  • Remove overflow: hidden, try to handle it in a different way. Maybe put display: none to your navigation or use visibility property. There are many options. You can also use overflow-x: hidden property, so overflow will be hidden only in the X axis.

Hope this helps! Have a nice day and happy coding 😁!

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