81 lines
2.3 KiB
Svelte
81 lines
2.3 KiB
Svelte
<script>
|
|
import { onMount } from 'svelte'
|
|
import { stores } from '@sapper/app'
|
|
import {
|
|
site,
|
|
currentLocation,
|
|
currentPhotos,
|
|
pageReady,
|
|
pageAnimation
|
|
} from 'utils/store'
|
|
// Dependencies
|
|
import Lazy from 'svelte-lazy'
|
|
// Components
|
|
import IconArrow from 'atoms/IconArrow'
|
|
import TitleSite from 'atoms/TitleSite'
|
|
import InteractiveGlobe from 'molecules/InteractiveGlobe'
|
|
import Locations from 'organisms/Locations'
|
|
import Footer from 'organisms/Footer'
|
|
import Transition from 'utils/Transition'
|
|
import SocialMetas from 'utils/SocialMetas'
|
|
// Animations
|
|
import { animateIn } from 'animations/page'
|
|
|
|
// Variables
|
|
const { page } = stores()
|
|
pageAnimation.set(animateIn)
|
|
const pageTitle = `${$site.seo_name} - ${$site.seo_title_default} across the globe`
|
|
|
|
// Reset current location
|
|
currentLocation.set()
|
|
currentPhotos.set()
|
|
|
|
|
|
/*
|
|
** Run code when mounted
|
|
*/
|
|
onMount(() => {
|
|
// Page is loaded
|
|
pageReady.set(true)
|
|
})
|
|
</script>
|
|
|
|
<svelte:head>
|
|
<title>{pageTitle}</title>
|
|
<meta name="description" content={$site.seo_description_default}>
|
|
<SocialMetas
|
|
url="{process.env.CONFIG.PROD_URL}{$page.path}"
|
|
title="{pageTitle}"
|
|
description={$site.seo_description_default}
|
|
image={$site.seo_share_image.full_url}
|
|
/>
|
|
</svelte:head>
|
|
|
|
<main class="housesof" class:is-transitioning={!$pageReady}>
|
|
<section class="page explore">
|
|
<div class="wrap">
|
|
<div class="page__top">
|
|
<a href="/" class="button-control button-control--lightpink dir-left" aria-label="Back to homepage" rel="prefetch">
|
|
<IconArrow direction="left" color="#fff" class="icon" />
|
|
<IconArrow direction="left" color="#fff" class="icon" hidden="true" />
|
|
</a>
|
|
|
|
<TitleSite />
|
|
</div>
|
|
|
|
<div class="explore__description page__description page__part style-description">
|
|
<p>{$site.explore_globe}</p>
|
|
</div>
|
|
</div>
|
|
|
|
{#if process.browser}
|
|
<Lazy offset={window.innerHeight} fadeOption={null}>
|
|
<InteractiveGlobe />
|
|
</Lazy>
|
|
{/if}
|
|
|
|
<Locations />
|
|
</section>
|
|
|
|
<Footer />
|
|
</main> |