Place: Bind window width to a variable

An error (window is not defined) would throw otherwise
This commit is contained in:
2020-04-12 11:58:21 +02:00
parent e27e8a16db
commit c059c07778

View File

@@ -32,10 +32,8 @@
pageReady
} from 'utils/store'
import { formatDate, relativeTime, getThumbnail } from 'utils/functions'
// Dependencies
import lazySizes from 'lazysizes'
// Components
import IconGlobe from 'atoms/IconGlobe'
import IconGlobeSmall from 'atoms/IconGlobeSmall'
@@ -47,7 +45,6 @@
import Footer from 'organisms/Footer'
import SocialMetas from 'utils/SocialMetas'
import Transition from 'utils/Transition'
// Animations
import { animateIn } from 'animations/place'
@@ -55,6 +52,7 @@
export let photos
const { page } = stores()
let layoutSetting
let windowWidth
// Update current location
const location = $locations.find(loc => loc.slug === $page.params.place)
@@ -107,6 +105,8 @@
/>
</svelte:head>
<svelte:window bind:innerWidth={windowWidth} />
<Transition {animateIn}>
<section class="place">
<div class="place__title">
@@ -122,7 +122,7 @@
<a href="/choose" class="button-control button-control--big button-control--dashed" aria-label="Change the location">
<span class="center">
<IconGlobe width={window.innerWidth <= 768 ? 32 : 44} color="#fff" />
<IconGlobe width={windowWidth <= 768 ? 32 : 44} color="#fff" />
<span>Change</span>
</span>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">