From f78f3cddc7946d7673954b5c7c055108b8b08e2f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= <crazyserver@gmail.com>
Date: Mon, 25 Feb 2019 17:11:42 +0100
Subject: [PATCH] MOBILE-1973 quiz: Make the navigation modal lateral

---
 src/addon/mod/quiz/pages/player/player.ts |  2 +-
 src/app/app.scss                          | 23 ++++++++++++++++-------
 2 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/src/addon/mod/quiz/pages/player/player.ts b/src/addon/mod/quiz/pages/player/player.ts
index 669445fbc..83fb1dca3 100644
--- a/src/addon/mod/quiz/pages/player/player.ts
+++ b/src/addon/mod/quiz/pages/player/player.ts
@@ -94,7 +94,7 @@ export class AddonModQuizPlayerPage implements OnInit, OnDestroy {
         // Create the navigation modal.
         this.navigationModal = modalCtrl.create('AddonModQuizNavigationModalPage', {
             page: this
-        });
+        }, { cssClass: 'core-modal-lateral' });
     }
 
     /**
diff --git a/src/app/app.scss b/src/app/app.scss
index eb0aad801..63d415519 100644
--- a/src/app/app.scss
+++ b/src/app/app.scss
@@ -721,13 +721,22 @@ ion-app.app-root {
     width: 100%;
   }
 
-  .core-modal-fullscreen {
-    .modal-wrapper {
-      position: absolute;
-      @include position(0 !important, null, null, 0 !important);
-      display: block;
-      width: 100% !important;
-      height: 100% !important;
+  .core-modal-fullscreen  .modal-wrapper {
+    position: absolute;
+    @include position(0 !important, null, null, 0 !important);
+    display: block;
+    width: 100% !important;
+    height: 100% !important;
+  }
+
+  @media only screen and (min-height: 600px) and (min-width: 768px) {
+      .core-modal-lateral  .modal-wrapper {
+        position: absolute;
+        @include position(0 !important, 0 !important, 0 !important, auto);
+        display: block;
+        height: 100% !important;
+        width: auto;
+        min-width: 400px;
     }
   }