From 0a02c665fcc51ee31de351d5ad3b9670d8bedf26 Mon Sep 17 00:00:00 2001
From: Nicolas Mowen <nickmowen213@gmail.com>
Date: Tue, 29 Jul 2025 09:11:52 -0600
Subject: [PATCH] Improve the tablet layout (#19320)

* Improve the tablet layout

* Update imports sort

* Fix more imports
---
 frigate/util/classification.py            |  2 +-
 frigate/video.py                          |  2 +-
 web/src/views/recording/RecordingView.tsx | 20 ++++++++++++++++----
 3 files changed, 18 insertions(+), 6 deletions(-)

diff --git a/frigate/util/classification.py b/frigate/util/classification.py
index 87942a916..e4133ded4 100644
--- a/frigate/util/classification.py
+++ b/frigate/util/classification.py
@@ -11,8 +11,8 @@ from frigate.comms.inter_process import InterProcessRequestor
 from frigate.const import (
     CLIPS_DIR,
     MODEL_CACHE_DIR,
-    UPDATE_MODEL_STATE,
     PROCESS_PRIORITY_LOW,
+    UPDATE_MODEL_STATE,
 )
 from frigate.log import redirect_output_to_logger
 from frigate.types import ModelStatusTypesEnum
diff --git a/frigate/video.py b/frigate/video.py
index 2754a12cd..b8b8fcdb2 100755
--- a/frigate/video.py
+++ b/frigate/video.py
@@ -22,8 +22,8 @@ from frigate.config.camera.updater import (
 from frigate.const import (
     CACHE_DIR,
     CACHE_SEGMENT_FORMAT,
-    REQUEST_REGION_GRID,
     PROCESS_PRIORITY_HIGH,
+    REQUEST_REGION_GRID,
 )
 from frigate.log import LogPipe
 from frigate.motion import MotionDetector
diff --git a/web/src/views/recording/RecordingView.tsx b/web/src/views/recording/RecordingView.tsx
index 6030352e9..494658e76 100644
--- a/web/src/views/recording/RecordingView.tsx
+++ b/web/src/views/recording/RecordingView.tsx
@@ -30,7 +30,12 @@ import {
   useRef,
   useState,
 } from "react";
-import { isDesktop, isMobile } from "react-device-detect";
+import {
+  isDesktop,
+  isMobile,
+  isMobileOnly,
+  isTablet,
+} from "react-device-detect";
 import { IoMdArrowRoundBack } from "react-icons/io";
 import { useNavigate } from "react-router-dom";
 import { Toaster } from "@/components/ui/sonner";
@@ -621,9 +626,16 @@ export function RecordingView({
                     )
                   : cn(
                       "pt-2 portrait:w-full",
-                      mainCameraAspect == "wide"
-                        ? "aspect-wide landscape:w-full"
-                        : "aspect-video landscape:h-[94%] landscape:xl:h-[65%]",
+                      isMobileOnly &&
+                        (mainCameraAspect == "wide"
+                          ? "aspect-wide landscape:w-full"
+                          : "aspect-video landscape:h-[94%] landscape:xl:h-[65%]"),
+                      isTablet &&
+                        (mainCameraAspect == "wide"
+                          ? "aspect-wide landscape:w-full"
+                          : mainCameraAspect == "normal"
+                            ? "landscape:w-full"
+                            : "aspect-video landscape:h-[100%]"),
                     ),
               )}
               style={{