From bc6bd0c5770a3a88e0fa1a721e9bb1d1927f7bec Mon Sep 17 00:00:00 2001
From: Nicolas Mowen <nickmowen213@gmail.com>
Date: Fri, 2 Aug 2024 06:56:45 -0600
Subject: [PATCH] Handle mobile landscape

---
 web/src/pages/Exports.tsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/web/src/pages/Exports.tsx b/web/src/pages/Exports.tsx
index 6d00c92fa..451d52052 100644
--- a/web/src/pages/Exports.tsx
+++ b/web/src/pages/Exports.tsx
@@ -17,6 +17,7 @@ import { cn } from "@/lib/utils";
 import { DeleteClipType, Export } from "@/types/export";
 import axios from "axios";
 import { useCallback, useEffect, useMemo, useState } from "react";
+import { isMobile } from "react-device-detect";
 import { LuFolderX } from "react-icons/lu";
 import { toast } from "sonner";
 import useSWR from "swr";
@@ -131,14 +132,16 @@ function Exports() {
           }
         }}
       >
-        <DialogContent className="max-w-[80%]">
+        <DialogContent
+          className={cn("max-w-[80%]", isMobile && "landscape:max-w-[60%]")}
+        >
           <DialogTitle className="capitalize">
             {selected?.name?.replaceAll("_", " ")}
           </DialogTitle>
           <video
             className={cn(
               "size-full rounded-lg md:rounded-2xl",
-              selectedAspect < 1.5 ? "aspect-video h-full" : "",
+              selectedAspect < 1.5 && "aspect-video h-full",
             )}
             playsInline
             preload="auto"