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