Enterprise: Contextual Action Panel and Modal: Take up full width+height on mobile breakpoint

[nickwynja]

Is your feature request related to a problem? Please describe.
On mobile breakpoints, the contextual action panel has a constrained size, which cramps the content and introduces issues with zoom and scroll.

Describe the solution you'd like

• [x] At a mobile breakpoint, the contextual action panel should take the full height and width of the viewport so it behaves like a "sheet".
• [x] Overall, modals should contain less padding around the edges.
• [x] Contextual Action Panels should be setup to allow horizontal scrolling, if applicable.

This also requires converting some components to using the contextual action panel instead of the simple modal. (See #2432)

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context

[tmcconechy]

Just to clarify we want to permanently make this one full page on mobile? http://master-enterprise.demo.design.infor.com/components/contextualactionpanel/example-index.html

[nickwynja]

Correct. We'd remove the height and width constraints and it would cover the screen (like a whole-page takeover).

[tmcconechy]

In addition we should make the modals have less padding and scroll horizontally as per the referenced issue and https://teams.microsoft.com/l/message/19:[email protected]/1562057289558?tenantId=457d5685-0467-4d05-b23b-8f817adda47c&groupId=4f50ef7d-e88d-4ccb-98ca-65f26e57fe35&parentMessageId=1562057289558&teamName=IDS%20Enterprise%20Development%20(SoHo%20Xi)&channelName=Angular%20Components&createdTime=1562057289558

[EdwardCoyle]

Added Tim's bulletpoints to the original issue. Additionally...

This also requires converting some components to using the contextual action panel instead of the simple modal. (See #2432)

The work on this ticket can be done independently of #2432. I think it's a good idea to move certain components away from the standard modal and into the CAP if they are too complex, but I'm not sure we have any "components" that need that work done at the moment... although I'm sure we could find some sample pages where that would be the case.

[VINAYREDDY59]

, In addition, we should make the modals have less padding and scroll horizontally as per the referenced issue and https://teams.microsoft.com/l/message/19:[email protected]/1562057289558?tenantId=457d5685-0467-4d05-b23b-8f817adda47c&groupId=4f50ef7d-e88d-4ccb-98ca-65f26e57fe35&parentMessageId=1562057289558&teamName=IDS%20Enterprise%20Development%20(SoHo%20Xi)&channelName=Angular%20Components&createdTime=1562057289558

Hi,
Could you please update me the status of this issue?

[tmcconechy]

This is being worked on in the current sprint for version 4.22 version released on or before Oct 14th.

[janahintal]

QA Passed. Will move to Done.
Verified in http://master-enterprise.demo.design.infor.com/components/modal/example-fullsize-responsive.html
http://master-enterprise.demo.design.infor.com/components/contextualactionpanel/test-fullsize-always.html
http://master-enterprise.demo.design.infor.com/components/contextualactionpanel/test-horizontal-scrolling.html