From 5b590b81b5f759c1d7e96a23c29ad439f3a444cc Mon Sep 17 00:00:00 2001
From: Ola Alstad <OALST@equinor.com>
Date: Mon, 21 Oct 2024 08:40:27 +0200
Subject: [PATCH] Fix video resizing

---
 .../MissionPage/VideoStream/FullScreenVideo.tsx      | 12 +-----------
 .../MissionPage/VideoStream/VideoStreamWindow.tsx    |  4 ++++
 .../src/components/Pages/RobotPage/PressureTable.tsx |  1 +
 3 files changed, 6 insertions(+), 11 deletions(-)

diff --git a/frontend/src/components/Pages/MissionPage/VideoStream/FullScreenVideo.tsx b/frontend/src/components/Pages/MissionPage/VideoStream/FullScreenVideo.tsx
index caf206f3..c3dc871b 100644
--- a/frontend/src/components/Pages/MissionPage/VideoStream/FullScreenVideo.tsx
+++ b/frontend/src/components/Pages/MissionPage/VideoStream/FullScreenVideo.tsx
@@ -37,16 +37,6 @@ export const FullScreenVideoStreamCard = ({
     videoStreamName,
     toggleFullScreenMode,
 }: IFullScreenVideoStreamCardProps) => {
-    const cardWidth = () => {
-        const availableInnerHeight = window.innerHeight - 9 * 16
-        const availableInnerWidth = window.innerWidth - 2 * 16
-        const coverageFactor = 0.9
-        const aspectRatio = 16 / 9
-        return Math.round(
-            Math.min(coverageFactor * availableInnerWidth, aspectRatio * coverageFactor * availableInnerHeight)
-        )
-    }
-
     const fullScreenExitButton = (shouldRotate270Clockwise: boolean) => {
         if (shouldRotate270Clockwise) {
             return (
@@ -64,7 +54,7 @@ export const FullScreenVideoStreamCard = ({
 
     // Rotated stream is not supported for simpleplayer
     return (
-        <FullScreenCard style={{ boxShadow: tokens.elevation.raised, width: cardWidth() }}>
+        <FullScreenCard style={{ boxShadow: tokens.elevation.raised, width: '100%', backgroundColor: 'white' }}>
             <Typography variant="h5">{videoStreamName}</Typography>
             <VideoPlayerSimpleStream videoStream={videoStream} videoStreamName={videoStreamName} />
             {fullScreenExitButton(false)}
diff --git a/frontend/src/components/Pages/MissionPage/VideoStream/VideoStreamWindow.tsx b/frontend/src/components/Pages/MissionPage/VideoStream/VideoStreamWindow.tsx
index ad1722e1..e54432e6 100644
--- a/frontend/src/components/Pages/MissionPage/VideoStream/VideoStreamWindow.tsx
+++ b/frontend/src/components/Pages/MissionPage/VideoStream/VideoStreamWindow.tsx
@@ -18,8 +18,12 @@ const VideoFullScreen = styled(ReactModal)`
     position: absolute;
     top: 50%;
     left: 50%;
+    width: 90%;
     transform: translate(-50%, -50%);
     padding-top: 5rem;
+    display: flex;
+    justify-content: center;
+    align-items: center;
 `
 
 interface VideoStreamWindowProps {
diff --git a/frontend/src/components/Pages/RobotPage/PressureTable.tsx b/frontend/src/components/Pages/RobotPage/PressureTable.tsx
index ea117dc7..996a052b 100644
--- a/frontend/src/components/Pages/RobotPage/PressureTable.tsx
+++ b/frontend/src/components/Pages/RobotPage/PressureTable.tsx
@@ -15,6 +15,7 @@ const StyledTable = styled.div`
     display: grid;
     overflow-x: auto;
     overflow-y: hidden;
+    z-index: 0;
 `
 
 const StyledTableRow = styled(Table.Row)`