-
Notifications
You must be signed in to change notification settings - Fork 215
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
feat(modal): Support scrolling entire modal #905
feat(modal): Support scrolling entire modal #905
Conversation
minHeight: 'calc(100% - (1.75rem * 2))', | ||
|
||
// IE11 fix for setting min-height in a flex container | ||
'&::before': { |
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.
IE11 fix for min-height philipwalton/flexbugs#231
@@ -184,6 +191,18 @@ const useInitialFocus = ( | |||
}, [modalRef, firstFocusRef]); | |||
}; | |||
|
|||
const useRemoveBodyScroll = () => { |
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.
added a hook to remove scroll on body when modal is open
Test summaryRun details
View run in Cypress Dashboard ➡️ This comment has been generated by cypress-bot as a result of this project's GitHub integration settings. You can manage this integration in this project's settings in the Cypress Dashboard |
alignItems: 'center', | ||
justifyContent: 'center', | ||
margin: '1.75rem auto', |
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.
used 1.75rem as the margin for the top and bottom value (same as bootstrap), as i am unsure how much space to put when the model is higher than viewport
Cool. Thanks for this. I'll look into these changes for the non-full modal scroll as well. We have plans to update the |
Sorry we weren't able to merge this. If anyone finds it should be picked up we can re-open it or you can create a new PR incorporating the relevant changes. |
It also looks like #1259 will address this based on recent changes to our modal component. |
Summary
This PR adds support for scrolling long content on modal. #790
Checklist
yarn test
passescanvas-kit-react
and/orcanvas-kit-css
universal modules, ifapplicable
Additional References