reactist icon indicating copy to clipboard operation
reactist copied to clipboard

fix: Set max-height on reactist_menulist

Open jvalente opened this issue 2 years ago • 0 comments

Closes https://github.com/Doist/Issues/issues/7375

Short description

Applies min-height: 44px and max-height: var(--popover-available-height) to .reactist_menulist in order to allow the menu list popover to scroll when it's height is greater than the viewport.

The min-height is set according to the minimum target size for pointer inputs.

This fixed is based on the ariakit menu example implementation.

Test plan

  • Run the Reactist storybook
  • Navigate into the Components > Menu > Simple Menu Example canvas tab.
  • Expand the Simple Menu
  • [x] After reducing the canvas height the simple menu popover contents become scrollable.

PR Checklist

  • [ ] Added tests for bugs / new features
  • [x] Updated docs (storybooks, readme)
  • [x] Executed npm run validate and made sure no errors / warnings were shown
  • [x] Described changes in CHANGELOG.md
  • [ ] Bumped version in package.json and package-lock.json (npm --no-git-tag-version version <major|minor|patch>) ref
  • [ ] Updated all static build artifacts (npm run build-all)

Versioning

jvalente avatar Aug 23 '22 14:08 jvalente