From 95b8d7b46ba21a4d6025d547d065b13c6a5591dc Mon Sep 17 00:00:00 2001
From: Shivank Kacker <kacker.shivank@gmail.com>
Date: Fri, 27 Sep 2024 16:58:22 +0530
Subject: [PATCH 1/2] Fix camera feed fullscreen bug

---
 src/Components/CameraFeed/CameraFeed.tsx | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/Components/CameraFeed/CameraFeed.tsx b/src/Components/CameraFeed/CameraFeed.tsx
index 863a6bbac8a..b5b9f39260e 100644
--- a/src/Components/CameraFeed/CameraFeed.tsx
+++ b/src/Components/CameraFeed/CameraFeed.tsx
@@ -157,7 +157,7 @@ export default function CameraFeed(props: Props) {
         <div
           className={classNames(
             isFullscreen ? "hidden lg:flex" : "flex",
-            "items-center justify-between px-4 py-0.5 transition-all duration-500 ease-in-out lg:py-1",
+            "shrink-0 items-center justify-between px-4 py-0.5 transition-all duration-500 ease-in-out lg:py-1",
             (() => {
               if (playerStatus !== "playing") {
                 return "bg-black text-zinc-400";
@@ -202,7 +202,7 @@ export default function CameraFeed(props: Props) {
             )}
           </div>
         </div>
-        <div className="group relative aspect-video bg-black">
+        <div className="group relative flex-1 bg-black">
           {/* Notifications */}
           <FeedAlert state={state} />
           {playerStatus === "playing" && <FeedWatermark />}
@@ -250,7 +250,7 @@ export default function CameraFeed(props: Props) {
           <VideoPlayer
             playerRef={playerRef}
             streamUrl={streamUrl}
-            className="absolute inset-x-0 mx-auto aspect-video max-h-full w-full"
+            className="max-h-[calc(100vh-40px)] w-full object-contain"
             onPlay={() => {
               setPlayedOn(new Date());
               setState("playing");
@@ -266,6 +266,7 @@ export default function CameraFeed(props: Props) {
             }}
             onError={props.onStreamError}
           />
+
           {inlineControls && playerStatus === "playing" && controls}
         </div>
         {!inlineControls && (

From 9d8ad89ff91c5475e3eca9829196769dec970054 Mon Sep 17 00:00:00 2001
From: Shivank Kacker <kacker.shivank@gmail.com>
Date: Fri, 27 Sep 2024 18:23:03 +0530
Subject: [PATCH 2/2] fix live monitoring page

---
 src/Components/CameraFeed/CameraFeed.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/Components/CameraFeed/CameraFeed.tsx b/src/Components/CameraFeed/CameraFeed.tsx
index b5b9f39260e..a52214f5946 100644
--- a/src/Components/CameraFeed/CameraFeed.tsx
+++ b/src/Components/CameraFeed/CameraFeed.tsx
@@ -145,10 +145,10 @@ export default function CameraFeed(props: Props) {
   );
 
   return (
-    <div ref={playerWrapperRef} className="flex flex-col justify-center">
+    <div ref={playerWrapperRef} className="flex h-full flex-col justify-center">
       <div
         className={classNames(
-          "flex max-h-screen flex-col justify-center",
+          "flex max-h-screen min-h-full flex-col justify-center",
           props.className,
           isFullscreen ? "bg-black" : "bg-zinc-100",
           isIOS && isFullscreen && "px-20",