marcel/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-09-25 18:31:15 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: reintroduce height-based mobile query detection (#10020)

Browse Source
This commit is contained in:
David Luzar
2025-09-24 18:17:39 +02:00
committed by GitHub
parent 00ae455873
commit f738b74791
2 changed files with 9 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
packages/common/src/constants.ts
View File

@@ -354,6 +354,9 @@ export const DEFAULT_UI_OPTIONS: AppProps["UIOptions"] = {
// mobile: up to 699px // mobile: up to 699px
export const MQ_MAX_MOBILE = 599; export const MQ_MAX_MOBILE = 599;
export const MQ_MAX_WIDTH_LANDSCAPE = 1000;
export const MQ_MAX_HEIGHT_LANDSCAPE = 500;
// tablets // tablets
export const MQ_MIN_TABLET = MQ_MAX_MOBILE + 1; // lower bound (excludes phones) export const MQ_MIN_TABLET = MQ_MAX_MOBILE + 1; // lower bound (excludes phones)
export const MQ_MAX_TABLET = 1400; // upper bound (excludes laptops/desktops) export const MQ_MAX_TABLET = 1400; // upper bound (excludes laptops/desktops)

8
packages/excalidraw/components/App.tsx
View File

@@ -103,6 +103,8 @@ import {
MQ_MAX_MOBILE, MQ_MAX_MOBILE,
MQ_MIN_TABLET, MQ_MIN_TABLET,
MQ_MAX_TABLET, MQ_MAX_TABLET,
MQ_MAX_HEIGHT_LANDSCAPE,
MQ_MAX_WIDTH_LANDSCAPE,
} from "@excalidraw/common"; } from "@excalidraw/common";
import { import {
@@ -2423,8 +2425,10 @@ class App extends React.Component<AppProps, AppState> {
}; };
private isMobileBreakpoint = (width: number, height: number) => { private isMobileBreakpoint = (width: number, height: number) => {
const minSide = Math.min(width, height); return (
return minSide <= MQ_MAX_MOBILE; width <= MQ_MAX_MOBILE ||
(height < MQ_MAX_HEIGHT_LANDSCAPE && width < MQ_MAX_WIDTH_LANDSCAPE)
);
}; };
private isTabletBreakpoint = (editorWidth: number, editorHeight: number) => { private isTabletBreakpoint = (editorWidth: number, editorHeight: number) => {