Better5afe• 850
@better5afe
Posted
Hi David!
Firstly, congrats on completing this project! 🎉 I hope you had a lot of fun while making it.
Overall, it looks pretty solid, but you can find some tips on how you can make it even better:
- Box shadow - in my opinion, it's a little bit too dark for the dropdown menus. You can either make it a little bit lighter on your own, or you can use one of many box shadow generators to adjust the color and the shape and then add it to your project.
- Button border - if you hover on the primary-btn, the section spacing changes a little bit. It's because you are adding a border to it only on the hover event. Add a
border: 1px solid var(--Almost-Black)
to the primary-btn class and while the mouse is hovering over it, you only change the background color. The same this is happening to the Register button. - Padding - I would increase the padding on the X axis on the mobile viewport. Currently, the content is a little bit too close to the edges.
- Nav animation - it looks good, however I would consider adding an animation when it appears and disappears. It would improve the user experience.
- Nav position - on mobile viewport, the navigation takes 100vh of space, however the application content takes more than that and therefore, the nav and the nav shadow a cut if you scroll lower. To fix it, you can experiment with
postion: fixed; top: 0; right: 0; bottom: 0; left: 0;
on the mobile resolution.
That's all from my side, I hope you find it helpful. The project is really good and once again - congrats!
Happy Coding! 👻🎃
0
davidmurage• 320
@davidmurage
Posted
Thanks alot @better5afe for these tips.. I will try and implement them.
0