Tidy up device bindings provider
This commit is contained in:
parent
47ca925003
commit
473f18d510
|
@ -2,21 +2,19 @@
|
||||||
import Provider from "./Provider.svelte"
|
import Provider from "./Provider.svelte"
|
||||||
import { onMount } from "svelte"
|
import { onMount } from "svelte"
|
||||||
|
|
||||||
|
let width = window.innerWidth
|
||||||
const tabletBreakpoint = 768
|
const tabletBreakpoint = 768
|
||||||
const desktopBreakpoint = 1280
|
const desktopBreakpoint = 1280
|
||||||
|
|
||||||
let screenWidth = window.innerWidth
|
|
||||||
const resizeObserver = new ResizeObserver(entries => {
|
const resizeObserver = new ResizeObserver(entries => {
|
||||||
if (entries?.[0]) {
|
if (entries?.[0]) {
|
||||||
screenWidth = entries[0].contentRect?.width
|
width = entries[0].contentRect?.width
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
$: mobile = screenWidth && screenWidth < tabletBreakpoint
|
|
||||||
$: tablet =
|
$: data = {
|
||||||
screenWidth &&
|
mobile: width && width < tabletBreakpoint,
|
||||||
screenWidth >= tabletBreakpoint &&
|
tablet: width && width >= tabletBreakpoint && width < desktopBreakpoint,
|
||||||
screenWidth < desktopBreakpoint
|
}
|
||||||
$: data = { mobile, tablet }
|
|
||||||
|
|
||||||
onMount(() => {
|
onMount(() => {
|
||||||
const doc = document.documentElement
|
const doc = document.documentElement
|
||||||
|
|
Loading…
Reference in New Issue