From 6868128267e05180f94942b847184360157686b4 Mon Sep 17 00:00:00 2001 From: GRL Date: Wed, 9 Jun 2021 18:08:14 +0200 Subject: [PATCH] DOM Element game resize at the same time and the same size at the canvas of phaser Remove VisitCard scss unused --- front/src/Components/VisitCard/VisitCard.svelte | 11 ----------- front/src/Phaser/Services/WaScaleManager.ts | 8 ++++++++ front/style/style.scss | 2 -- 3 files changed, 8 insertions(+), 13 deletions(-) diff --git a/front/src/Components/VisitCard/VisitCard.svelte b/front/src/Components/VisitCard/VisitCard.svelte index cc7f00d6..c2e53f0c 100644 --- a/front/src/Components/VisitCard/VisitCard.svelte +++ b/front/src/Components/VisitCard/VisitCard.svelte @@ -17,17 +17,6 @@ width: 530px; margin-top: 200px; max-width: 100vw; - - .defaultCard { - border-radius: 5px; - border: 2px black solid; - background-color: whitesmoke; - width: 530px; - - header { - padding: 5px; - } - } iframe { border: 0; diff --git a/front/src/Phaser/Services/WaScaleManager.ts b/front/src/Phaser/Services/WaScaleManager.ts index acbecc38..cf10f195 100644 --- a/front/src/Phaser/Services/WaScaleManager.ts +++ b/front/src/Phaser/Services/WaScaleManager.ts @@ -39,6 +39,14 @@ class WaScaleManager { const style = this.scaleManager.canvas.style; style.width = Math.ceil(realSize.width / devicePixelRatio) + 'px'; style.height = Math.ceil(realSize.height / devicePixelRatio) + 'px'; + + // Resize the game element at the same size at the canvas + const gameStyle = document.getElementById('game')?.style; + if (gameStyle != undefined) { + gameStyle.height = style.height; + gameStyle.width = style.width; + } + // 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)) { if (scene instanceof ResizableScene) { diff --git a/front/style/style.scss b/front/style/style.scss index b22a3f57..b034baec 100644 --- a/front/style/style.scss +++ b/front/style/style.scss @@ -367,8 +367,6 @@ body { } #game { - height: 100%; - width: 100%; position: relative; /* Position relative is needed for the game-overlay. */ }