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: align MQ breakpoints and always use editor dimensions (#9991)

Browse Source 
* fix: align MQ breakpoints and always use editor dimensions

* naming

* update snapshots
This commit is contained in:
David Luzar
2025-09-17 09:57:10 +02:00
committed by GitHub
parent ac0d3059dc
commit a6a32b9b29
3 changed files with 10 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -100,9 +100,7 @@ import {
MINIMUM_ARROW_SIZE,
DOUBLE_TAP_POSITION_THRESHOLD,
isMobileOrTablet,
MQ_MAX_WIDTH_MOBILE,
MQ_MAX_HEIGHT_LANDSCAPE,
MQ_MAX_WIDTH_LANDSCAPE,
MQ_MAX_MOBILE,
MQ_MIN_TABLET,
MQ_MAX_TABLET,
} from "@excalidraw/common";
@@ -2423,10 +2421,8 @@ class App extends React.Component<AppProps, AppState> {
};
private isMobileBreakpoint = (width: number, height: number) => {
return (
width <= MQ_MAX_WIDTH_MOBILE ||
(height < MQ_MAX_HEIGHT_LANDSCAPE && width < MQ_MAX_WIDTH_LANDSCAPE)
);
const minSide = Math.min(width, height);
return minSide <= MQ_MAX_MOBILE;
};
private isTabletBreakpoint = (editorWidth: number, editorHeight: number) => {
@@ -2442,14 +2438,14 @@ class App extends React.Component<AppProps, AppState> {
return;
}
const { clientWidth: viewportWidth, clientHeight: viewportHeight } =
document.body;
const { width: editorWidth, height: editorHeight } =
container.getBoundingClientRect();
const prevViewportState = this.device.viewport;
const nextViewportState = updateObject(prevViewportState, {
isLandscape: viewportWidth > viewportHeight,
isMobile: this.isMobileBreakpoint(viewportWidth, viewportHeight),
isLandscape: editorWidth > editorHeight,
isMobile: this.isMobileBreakpoint(editorWidth, editorHeight),
});
if (prevViewportState !== nextViewportState) {