Configure adaptive positioning for small screens #3354

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.

Sign up for GitHub

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

Jump to bottom

Closed

ritikpal1122 wants to merge 1 commit into radix-ui:main from ritikpal1122:feature-request/#3282

ritikpal1122 commented Jan 29, 2025

feat(popover): improve responsive positioning behavior

Add collision detection and boundary constraints
Configure adaptive positioning for small screens
Implement fallback positions when space is limited
Add padding and sticky behavior for better UX

Whart I've fixed in this PR

Changes

Added collision detection using avoidCollisions prop
Set document.body as collision boundary
Configured adaptive positioning with fallback positions
Added 10px collision padding for better spacing
Implemented sticky behavior for smooth transitions

Testing

Tested on small screens
Verified tooltip repositioning when space is limited
Confirmed proper behavior on all viewport sizes


           Configure adaptive positioning for small screens

36c8266

Author

ritikpal1122 commented Jan 30, 2025

hi @chaance can you please check this out

ritikpal1122 closed this by deleting the head repository

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet