infor-design / enterprise-wc

Enterprise-grade web component library for the Infor Design System
Apache License 2.0
27 stars 26 forks source link

IdsSplitter: Add Mobile Support #691

Open EdwardCoyle opened 2 years ago

EdwardCoyle commented 2 years ago

Describe the bug IdsSplitter currently is not usable in mobile environments

To Reproduce Steps to reproduce the behavior:

  1. Go to https://main.wc.design.infor.com/ids-splitter
  2. Open Chrome Dev Tools, enable the device toolbar, and pick a phone/tablet or something with touch input. (Alternatively, open this page in a mobile browser)
  3. Try to use the splitter handles. See that they can't be dragged
  4. What should we do with pixel/percentage size on mobile devices?

Expected behavior It should be possible to split screen areas on a mobile device

ashachodavarapu commented 5 months ago

@tmcconechy , I have two more findings to add related to the splitter

  1. The splitter size is not fixed even though the panel width is given in pixels, please observe the below video=>

https://github.com/infor-design/enterprise-wc/assets/105051938/48c54ead-c5b0-41c0-a5dd-ac3a0baed4d5

  1. when the screen is changed to mobile view I can see the left and right panels, instead, I want one panel(either left or right panel) should be visible like the left panel should be 100% by default when the screen is in mobile view, please observe the below video for an understanding of the requirement

https://github.com/infor-design/enterprise-wc/assets/105051938/81b86b5f-1b54-43a7-9024-530bee757c7e

Thanks.