Ix-modal stays on top of scrollable page

[JakubRigoci]

Prerequisites

• I have read the Contributing Guidelines.
• I have not leaked any internal/restricted information like screenshots, videos, code snippets, links etc.

What happened?

When we have a scrollable page and a button trigerring modal on the bottom so the user has to scroll to access it, the trigerred modal appears on top of the page out of the user screen. Any workaround?

What type of frontend framework are you seeing the problem on?

Angular

Which version of iX do you use?

v2.6.0

Code to produce this issue.

https://stackblitz.com/edit/btyht4s4?file=src%2Fmodal-by-template.ts

[danielleroux]

Modal gets placed as toplayer on body. You can avoid this by placing a container around your application which handle the overflow or limit the body to fit the view height:

container:

<div
  style="
  position: relative;
  display: block;
  height: 100vh;
  width: 100vw;
  overflow: auto;
"
>
  <app-example></app-example>
</div>

body:

body {
  position: relative;
  display: block;
  height: 100vh;
  width: 100vw;
  overflow: auto;
}