From f738b74791b837a2530c1502eca61d3d51b3b583 Mon Sep 17 00:00:00 2001
From: David Luzar <5153846+dwelle@users.noreply.github.com>
Date: Wed, 24 Sep 2025 18:17:39 +0200
Subject: [PATCH] fix: reintroduce height-based mobile query detection (#10020)

---
 packages/common/src/constants.ts       | 3 +++
 packages/excalidraw/components/App.tsx | 8 ++++++--
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/packages/common/src/constants.ts b/packages/common/src/constants.ts
index a02ccfbb46..646fb08bff 100644
--- a/packages/common/src/constants.ts
+++ b/packages/common/src/constants.ts
@@ -354,6 +354,9 @@ export const DEFAULT_UI_OPTIONS: AppProps["UIOptions"] = {
 // mobile: up to 699px
 export const MQ_MAX_MOBILE = 599;
 
+export const MQ_MAX_WIDTH_LANDSCAPE = 1000;
+export const MQ_MAX_HEIGHT_LANDSCAPE = 500;
+
 // tablets
 export const MQ_MIN_TABLET = MQ_MAX_MOBILE + 1; // lower bound (excludes phones)
 export const MQ_MAX_TABLET = 1400; // upper bound (excludes laptops/desktops)
diff --git a/packages/excalidraw/components/App.tsx b/packages/excalidraw/components/App.tsx
index 2def157b4a..daeb44cefa 100644
--- a/packages/excalidraw/components/App.tsx
+++ b/packages/excalidraw/components/App.tsx
@@ -103,6 +103,8 @@ import {
   MQ_MAX_MOBILE,
   MQ_MIN_TABLET,
   MQ_MAX_TABLET,
+  MQ_MAX_HEIGHT_LANDSCAPE,
+  MQ_MAX_WIDTH_LANDSCAPE,
 } from "@excalidraw/common";
 
 import {
@@ -2423,8 +2425,10 @@ class App extends React.Component<AppProps, AppState> {
   };
 
   private isMobileBreakpoint = (width: number, height: number) => {
-    const minSide = Math.min(width, height);
-    return minSide <= MQ_MAX_MOBILE;
+    return (
+      width <= MQ_MAX_MOBILE ||
+      (height < MQ_MAX_HEIGHT_LANDSCAPE && width < MQ_MAX_WIDTH_LANDSCAPE)
+    );
   };
 
   private isTabletBreakpoint = (editorWidth: number, editorHeight: number) => {