From 281b8580cd6be6d9d5c993408d2fc838cec3491a Mon Sep 17 00:00:00 2001
From: GRL <g.lesniewski@thecodingmachine.com>
Date: Mon, 14 Jun 2021 15:54:22 +0200
Subject: [PATCH] Use window and not viewport in css for main-container

---
 front/src/Phaser/Services/WaScaleManager.ts | 2 +-
 front/style/style.scss                      | 9 +++++----
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/front/src/Phaser/Services/WaScaleManager.ts b/front/src/Phaser/Services/WaScaleManager.ts
index 52e5e14a..e40ef65f 100644
--- a/front/src/Phaser/Services/WaScaleManager.ts
+++ b/front/src/Phaser/Services/WaScaleManager.ts
@@ -44,8 +44,8 @@ class WaScaleManager {
 
         // Resize the game element at the same size at the canvas
         const gameStyle = HtmlUtils.getElementByIdOrFail<HTMLDivElement>('game').style;
-        gameStyle.height = style.height;
         gameStyle.width = style.width;
+        gameStyle.height = style.height;
 
         // Note: onResize will be called twice (once here and once is Game.ts), but we have no better way.
         for (const scene of this.game.scene.getScenes(true)) {
diff --git a/front/style/style.scss b/front/style/style.scss
index b034baec..8eae5330 100644
--- a/front/style/style.scss
+++ b/front/style/style.scss
@@ -337,13 +337,14 @@ video.myCamVideo{
 /* New layout */
 body {
     margin: 0;
-    height: 100vh;
-    width: 100vw;
+    height: 100%;
+    width: 100%;
 }
 .main-container {
-    height: 100vh;
-    width: 100vw;
+    height: 100%;
+    width: 100%;
     position: absolute;
+    background-color: #00d4ff;
 }
 
 @media (min-aspect-ratio: 1/1) {