fix: ui container responsiveness

harini-1597 commented 3 weeks ago

Fixes # (200)

Type of change

Please give a X on it which is applicable

[x] Bug fix (non-breaking change which fixes an issue)
[ ] New feature (non-breaking change which adds functionality)
[ ] Refactor Code
[ ] A documentation update
[ ] Others(mentioned in the issue number)

How Has This Been Tested?

Run code locally on machine, use developer tools in Chrome under "Inspect" to check responsiveness on different screens.

Screenshots and Videos:

https://github.com/pooranjoyb/popShop/assets/128628820/9e236f38-f12c-437e-90f5-2a848f77c4d0

Checklist:

give a X on it which is applicable

[x] My code follows the style guidelines of this project
[x] I have performed a self-review of my code
[x] I have commented my code, particularly in hard-to-understand areas
[x] I have made corresponding changes to the documentation
[x] My changes generate no new warnings
[x] I have added tests that prove my fix is effective or that my feature works
[x] New and existing unit tests pass locally with my changes
[x] Any dependent changes have been merged and published in downstream modules

vercel[bot] commented 3 weeks ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
pop-shop	❌ Failed (Inspect)			Jun 11, 2024 5:38pm

pooranjoyb commented 3 weeks ago

Hii @harini-1597 There are some issues. Please fix them.

Maintain the max-width of the container similar to other containers. You can see when zoomed out the container takes size of the entire screen, which is not the case for other containers.
You can see apart from Navbar, everything has max-width set.
There are some alignment issues with the <Head />. Please fix it.

harini-1597 commented 3 weeks ago

you can merge the pr

harini-1597 commented 3 weeks ago

Hey; if you use overflow-hidden the element heading gets cutoff, which was the main UI fix that was to be implemented. And I tried, but I'm unable to really fix that and make the x-scrollbar dissappear.

pooranjoyb commented 3 weeks ago

Hey; if you use overflow-hidden the element heading gets cutoff, which was the main UI fix that was to be implemented. And I tried, but I'm unable to really fix that and make the x-scrollbar dissappear.

okay np. lemme check with this once.

pooranjoyb / popShop