From a1b8b6e6e98f114dee98c331f711940be9a6b3da Mon Sep 17 00:00:00 2001
From: "Manu Mtz.-Almeida" <manu.mtza@gmail.com>
Date: Sun, 19 Nov 2017 04:04:07 +0100
Subject: [PATCH] fix(modal): fixes displaying page inside modal

---
 packages/core/src/components/modal/modal.scss | 25 -------------------
 packages/core/src/components/modal/modal.tsx  |  5 ++--
 .../components/modal/test/basic/index.html    |  2 +-
 3 files changed, 3 insertions(+), 29 deletions(-)

diff --git a/packages/core/src/components/modal/modal.scss b/packages/core/src/components/modal/modal.scss
index 9dcf3a357c..2454bc9817 100644
--- a/packages/core/src/components/modal/modal.scss
+++ b/packages/core/src/components/modal/modal.scss
@@ -97,28 +97,3 @@ ion-modal-controller {
   }
 }
 
-.modal-content {
-  @include position(0, null, null, 0);
-
-  position: absolute;
-
-  display: block;
-
-  // override the default visibility cloaking
-  // added for each component before it's loaded
-  // visibility: inherit !important;
-
-  width: 100%;
-  height: 100%;
-
-  // do not show by default, but still render
-  // so we can get dimensions before transitioning in
-  opacity: 0;
-
-  contain: strict;
-}
-
-.show-modal .modal-content {
-  // show the modal now that it's ready
-  opacity: 1;
-}
diff --git a/packages/core/src/components/modal/modal.tsx b/packages/core/src/components/modal/modal.tsx
index 45a66d7317..c7f61e6e3f 100644
--- a/packages/core/src/components/modal/modal.tsx
+++ b/packages/core/src/components/modal/modal.tsx
@@ -163,13 +163,12 @@ export class Modal {
   protected render() {
     const ThisComponent = this.component;
 
-    let userCssClasses = 'modal-content';
+    let userCssClasses = 'ion-page';
     if (this.cssClass) {
       userCssClasses += ` ${this.cssClass}`;
     }
 
     const dialogClasses = createThemedClasses(this.mode, this.color, 'modal-wrapper');
-    const thisComponentClasses = createThemedClasses(this.mode, this.color, userCssClasses);
 
     return [
       <div
@@ -185,7 +184,7 @@ export class Modal {
       >
         <ThisComponent
           {...this.componentProps}
-          class={thisComponentClasses}
+          class={userCssClasses}
         >
         </ThisComponent>
       </div>
diff --git a/packages/core/src/components/modal/test/basic/index.html b/packages/core/src/components/modal/test/basic/index.html
index 8a496e5ba5..1d4a7f58bb 100644
--- a/packages/core/src/components/modal/test/basic/index.html
+++ b/packages/core/src/components/modal/test/basic/index.html
@@ -31,7 +31,7 @@
     function presentModal() {
       controller
         .create({
-          component: 'ion-content'
+          component: 'page-one'
         })
         .then(modal => {
           modal.present();