diff --git a/front/dist/resources/style/cowebsite.scss b/front/dist/resources/style/cowebsite.scss index 33a6b6bf..b752728d 100644 --- a/front/dist/resources/style/cowebsite.scss +++ b/front/dist/resources/style/cowebsite.scss @@ -88,21 +88,26 @@ } } @media (max-aspect-ratio: 1/1) { + + #main-container { + display: flex; + flex-direction: column-reverse; + } #cowebsite { left: 0; - bottom: 0; + top: 0; width: 100%; height: 50%; display: flex; - flex-direction: column; + flex-direction: column-reverse; &.loading { - transform: translateY(90%); + transform: translateY(-90%); } &.hidden { - transform: translateY(100%); + transform: translateY(-100%); } main { diff --git a/front/src/WebRtc/CoWebsiteManager.ts b/front/src/WebRtc/CoWebsiteManager.ts index e352d70c..95885a53 100644 --- a/front/src/WebRtc/CoWebsiteManager.ts +++ b/front/src/WebRtc/CoWebsiteManager.ts @@ -32,7 +32,7 @@ class CoWebsiteManager { private resizing: boolean = false; private cowebsiteMainDom: HTMLDivElement; private cowebsiteAsideDom: HTMLDivElement; - + get width(): number { return this.cowebsiteDiv.clientWidth; } @@ -74,7 +74,7 @@ class CoWebsiteManager { private initResizeListeners() { const movecallback = (event:MouseEvent) => { - this.verticalMode ? this.height -= event.movementY / this.getDevicePixelRatio() : this.width -= event.movementX / this.getDevicePixelRatio(); + this.verticalMode ? this.height += event.movementY / this.getDevicePixelRatio() : this.width -= event.movementX / this.getDevicePixelRatio(); this.fire(); }