smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: make device breakpoints more specific (#7243)

Browse source
This commit is contained in:
David Luzar 2023-11-06 16:29:00 +01:00 • committed by GitHub
parent 18a7b97515
commit b1037b342d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
28 changed files with 164 additions and 121 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/hooks/useCreatePortalContainer.ts
View file

@ -1,4 +1,4 @@
import { useState, useRef, useLayoutEffect } from "react";
import { useState, useLayoutEffect } from "react";
import { useDevice, useExcalidrawContainer } from "../components/App";
import { useUIAppState } from "../context/ui-appState";
@ -10,8 +10,6 @@ export const useCreatePortalContainer = (opts?: {
const device = useDevice();
const { theme } = useUIAppState();
const isMobileRef = useRef(device.isMobile);
isMobileRef.current = device.isMobile;
const { container: excalidrawContainer } = useExcalidrawContainer();
@ -19,11 +17,10 @@ export const useCreatePortalContainer = (opts?: {
if (div) {
div.className = "";
div.classList.add("excalidraw", ...(opts?.className?.split(/\s+/) || []));
div.classList.toggle("excalidraw--mobile", device.isMobile);
div.classList.toggle("excalidraw--mobile", isMobileRef.current);
div.classList.toggle("excalidraw--mobile", device.editor.isMobile);
div.classList.toggle("theme--dark", theme === "dark");
}
}, [div, theme, device.isMobile, opts?.className]);
}, [div, theme, device.editor.isMobile, opts?.className]);
useLayoutEffect(() => {
const container = opts?.parentSelector