CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-07-05 14:31:17 +12:00
Code Issues Projects Releases Wiki Activity

Use correct component to determine device size

Browse source
This commit is contained in:
Andrew Kingston 2021-09-08 10:22:48 +01:00
parent a6106ac0e1
commit 5d305bb8e7
1 changed files with 5 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
packages/client/src/components/context/DeviceBindingsProvider.svelte
View file

@ -3,21 +3,25 @@
import { onMount } from "svelte"
let width = window.innerWidth
let height = window.innerHeight
const tabletBreakpoint = 768
const desktopBreakpoint = 1280
const resizeObserver = new ResizeObserver(entries => {
if (entries?.[0]) {
width = entries[0].contentRect?.width
height = entries[0].contentRect?.height
}
})
$: data = {
mobile: width && width < tabletBreakpoint,
tablet: width && width >= tabletBreakpoint && width < desktopBreakpoint,
width,
height,
}
onMount(() => {
const doc = document.getElementById("device-root")
const doc = document.getElementById("app-root")
resizeObserver.observe(doc)
return () => {