InlineActionBar and contents do not remain fixed when Dialog is scrollable - Githubissues

square / maker

Maker Design System by Square

https://square.github.io/maker/styleguide/latest-stable/

Other

63 stars 14 forks source link

InlineActionBar and contents do not remain fixed when Dialog is scrollable #397

Closed mbove-square closed 2 years ago

mbove-square commented 2 years ago

Bug description

What did you do?
- Created a maker Dialog component where the content was long enough to become scrollable
What did you expect
- Expected the InnerActionBar to remain fixed to the bottom of the screen when the user is scrolling
What happened instead?
- Instead the InnerActionBar began scrolling up the screen

https://user-images.githubusercontent.com/82115556/181278341-cf92f435-151f-4476-b9ab-0f45748124af.mov

Reproduction

Open up the maker styleguide Dialog exmaple
Resize the browser window to be mobile size (i.e. < 840px)
Add content to one of the dialogs so that the content becomes scrollable (I added lorem ipsum text so that the DialogContent class was greater than 1200px
When the user scrolls, the InnerActionBar also scrolls

Environment

System:
    OS: macOS 12.4
    CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 2.79 GB / 64.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 6.9.1 - ~/.nvm/versions/node/v6.9.1/bin/node
    npm: 3.10.8 - ~/.nvm/versions/node/v6.9.1/bin/npm
  npmPackages:
    @square/maker: ^11.8.3 => 11.8.3 
    vue: ^2.6.14 => 2.6.14 
    webpack: ^5.37.0 => 5.38.1

Addressed by

No response

Can you contribute a fix?

[ ] I’m interested in opening a pull request for this issue.

laurenhu commented 2 years ago

Fixed in https://github.com/square/maker/releases/tag/v14.0.3