Product Landing Page Completed

Code Feedback
1

Hey Guys,
I have completed the product landing page project .

Please provide your feedback and criticism.
Thanks.

2

Works expected in desktop, but not very well in mobile, just check:
image

The top navigation overflow over title text at top scroll! not good.

This is becasue of links of on top navigation, if you could code the top navigation more mobile friendly, then links never go down one line to make this issue. (check this good hamburger like manu which works always for mobile, try to resize the preview panel to see what happens for top nav)

You applied a very smooth shadow for the top nav, this is very good.

Placeholder for the text field, good.

The video I think is very small for both desktop and mobile!, you may use a simple css rule like following for it

.video_frame{
    width: 90vw;
    height: 50vw;
    max-width: 9in;
    max-height: 5in;
}

With some hand of relative units, now it works for all screens, no need any media queries I think.

The book parent div (.kitab) are very small for desktop! try not to use absolute units, also in mobile you may remove the shadow, and border to grab more space for text.

Footer also needs some top margin to no overflow on last element.

Try to fix the issue.

Keep going on great work, happy programming

3

I have not learnt javascript yet so that hamburger code i do not get.

4

This is okay dear, don’t be worry about it, and do not rush. Just keep it in mind you will be able to do many more stuffs with some hand of js.

keep going on good work.

Happy programming

5

Great work on the landing page!
I’m working on mine right now and since I too dont know JS yet the hamburger menu is not an option for me.
What exactly did you do to eliminate the navigation overflow?

6

Hey @deepshah,
If you are asking about the mobile devices,
I got my font-size reduced and even reduced the padding between the nav-bar links.
If you could provide you code or codepen link, i could help you more.
and i would recommend a separate topic for that.
It is always best to create your own thread for you specific question(s)