This page (page URL -https://runingproject.netlify.app) is showing good without any white space between two images if open the page inside the laptop but when I open it on mobile it is taking too much space as the below-attached pic is showing.
laptop showing pic- laptop loading page
mobile showing pic -Mobile loading page
Here is my source code link - https://github.com/sunil7117/demo.git
Please note: Inside "mainComponent" folder, there are two components and both are some.
I read your code and classes. I see you use static height 90vh for main component body but your navbar has default material ui height size. In this case your navbar height have been responsive and your body is static. My solution is using static height for navbar or responsive height for body. If you dont understand tell me help you more accurate One way is like below
<AppBar position="static" sx={{ height: '10vh' }} >
...
</AppBar>
And if you have footer you can divide extra 10vh between footer and navbar. The other way is a little bit complicated that have to determine all your body component to full page correctly. In this case if you have just simple image you can fit width of image and allow fit the image size.