(fix): modals issues

src/app/common/components/overlay-modal/overlay-modal.component.scss

@@ -122,7 +122,7 @@
  }
 }
 
-.m-overlay-modal--shown {
+.m-overlay-modal--shown, .m-overlay-modal--shown--no-scroll {
  overflow: hidden;
 }
 

src/app/common/components/overlay-modal/overlay-modal.component.ts

 import {
- Component,
  AfterViewInit,
- ViewChild,
+ Component,
  ComponentFactoryResolver,
  ComponentRef,
- Input,
- Injector, ElementRef
+ ElementRef,
+ Injector,
+ ViewChild
 } from '@angular/core';
 
 import { DynamicHostDirective } from '../../directives/dynamic-host.directive';
@@ -39,7 +39,8 @@ export class OverlayModalComponent implements AfterViewInit {
  constructor(
  private service: OverlayModalService,
  private _componentFactoryResolver: ComponentFactoryResolver
- ) { }
+ ) {
+ }
 
  ngAfterViewInit() {
  if (!this.root && document && document.body) {
@@ -52,9 +53,11 @@ export class OverlayModalComponent implements AfterViewInit {
  create(componentClass, opts?, injector?: Injector) {
  this.dismiss();
 
- opts = { ...{
- class: '',
- }, ...opts };
+ opts = {
+ ...{
+ class: '',
+ }, ...opts
+ };
 
  this.class = opts.class;
 
@@ -102,6 +105,7 @@ export class OverlayModalComponent implements AfterViewInit {
 
  if (this.root) {
  this.root.classList.add('m-overlay-modal--shown');
+ document.body.classList.add('m-overlay-modal--shown--no-scroll');
  }
  }
 
@@ -110,6 +114,7 @@ export class OverlayModalComponent implements AfterViewInit {
 
  if (this.root) {
  this.root.classList.remove('m-overlay-modal--shown');
+ document.body.classList.remove('m-overlay-modal--shown--no-scroll');
  }
 
  if (!this.componentInstance) {

src/app/modules/pro/channel/channel.component.html

@@ -158,4 +158,4 @@
  </div>
 </div>
 
-<m-overlay-modal #overlayModal style="z-index:99999999"></m-overlay-modal>
+<m-overlay-modal #overlayModal></m-overlay-modal>

src/app/modules/pro/channel/channel.component.scss

@@ -28,6 +28,13 @@ m-pro--channel {
  background-color: var(--m-pro--transparent-background-color);
  }
  }
+
+ &.m-overlay-modal--shown {
+ m-overlay-modal {
+ position: fixed;
+ z-index: 9999990;
+ }
+ }
 }
 
 @media screen and (max-width: 480px) {