-
Notifications
You must be signed in to change notification settings - Fork 1.4k
fix: infinite scroll in meshery page #7259
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix: infinite scroll in meshery page #7259
Conversation
Signed-off-by: saurabhraghuvanshii <[email protected]>
|
🚀 Preview for commit dc256e4 at: https://693863da402cdc88046be2c9--layer5.netlify.app |
Signed-off-by: saurabhraghuvanshii <[email protected]>
|
🚀 Preview for commit 82b47de at: https://69386904eed5930a42469f38--layer5.netlify.app |
Signed-off-by: saurabhraghuvanshii <[email protected]>
|
🚀 Preview for commit 0ec0982 at: https://6938740e4efe47214abe8153--layer5.netlify.app |
Signed-off-by: saurabhraghuvanshii <[email protected]>
|
🚀 Preview for commit ef7c3fd at: https://6938788d61c57b1f3bd9cbd3--layer5.netlify.app |
Signed-off-by: saurabhraghuvanshii <[email protected]>
|
🚀 Preview for commit a141823 at: https://69387d145c8b693ead10ade5--layer5.netlify.app |
Signed-off-by: saurabhraghuvanshii <[email protected]>
|
🚀 Preview for commit 8295915 at: https://6938819aed523949ef51088e--layer5.netlify.app |
src/sections/Meshery/Features-section/features-section.style.js
Outdated
Show resolved
Hide resolved
Signed-off-by: saurabhraghuvanshii <[email protected]>
Signed-off-by: saurabhraghuvanshii <[email protected]>
|
🚀 Preview for commit cbf26a6 at: https://69388f1361c57b5c42d9bdef--layer5.netlify.app |
Signed-off-by: saurabhraghuvanshii <[email protected]>
Signed-off-by: saurabhraghuvanshii <[email protected]>
|
🚀 Preview for commit 95f06d1 at: https://693895b682b9f87d7a096749--layer5.netlify.app |
Signed-off-by: saurabhraghuvanshii <[email protected]>
|
🚀 Preview for commit 69f3985 at: https://69389af461c57b7ccdd9bd1b--layer5.netlify.app |
Signed-off-by: saurabhraghuvanshii <[email protected]>
|
🚀 Preview for commit d6f4cc0 at: https://69389f1282b9f8981a096684--layer5.netlify.app |
Signed-off-by: saurabhraghuvanshii <[email protected]>
|
🚀 Preview for commit 000a7e7 at: https://6938a2fe5c8b69a42b10adfc--layer5.netlify.app |
|
Root cause is vertical carousel + missing flex wrapper resulted in production miscalculating height as infinite. |
|
🚀 Preview for commit 17286b8 at: https://693b08a8be4ac9ed296332e3--layer5.netlify.app |
|
@saurabhraghuvanshii |
Rajesh-Nagarajan-11
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM @saurabhraghuvanshii Thanks
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull request overview
This PR addresses an infinite scroll issue on the Meshery page by adding CSS constraints and layout properties to prevent overflow issues. The changes focus on controlling the width, height, and containment behavior of the main Meshery wrapper and the Features section.
Key Changes:
- Added flexbox layout properties to the main Meshery wrapper to constrain content flow
- Introduced CSS containment, isolation, and explicit dimension properties to the Features section
- Applied hard-coded height constraints to carousel elements to prevent expansion
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 4 comments.
| File | Description |
|---|---|
src/sections/Meshery/meshery.style.js |
Added flexbox layout (display: flex, flex-direction: column) and width: 100% to the main wrapper to establish proper content flow |
src/sections/Meshery/Features-section/features-section.style.js |
Added multiple CSS properties including containment (contain: layout style paint), isolation, width/height constraints, overflow control, and hard-coded carousel heights to prevent infinite scrolling |
Description
This PR fixes #
Notes for Reviewers
Signed commits