78 lines
2.4 KiB
Svelte
78 lines
2.4 KiB
Svelte
<script>
|
|
import { onMount } from 'svelte'
|
|
import { site, pageReady, pageTransition } from '../utils/store'
|
|
|
|
// Components
|
|
import IconArrow from '../atoms/IconArrow'
|
|
import TitleSite from '../atoms/TitleSite'
|
|
import LinkTranslate from '../atoms/LinkTranslate'
|
|
import InteractiveGlobe from '../molecules/InteractiveGlobe'
|
|
import Footer from '../organisms/Footer'
|
|
import SocialMetas from '../utils/SocialMetas'
|
|
|
|
// Animations
|
|
import { animateIn } from '../animations/page'
|
|
pageTransition.onAnimationEnd = animateIn
|
|
|
|
|
|
/*
|
|
** Run code when mounted
|
|
*/
|
|
onMount(() => {
|
|
// Page is loaded
|
|
pageReady.set(true)
|
|
})
|
|
</script>
|
|
|
|
<svelte:head>
|
|
<title>{$site.seo_name} - Credits</title>
|
|
<meta name="description" content={$site.credits_text}>
|
|
<SocialMetas
|
|
url="https://housesof.world/credits"
|
|
title="{$site.seo_name} - Credits"
|
|
description={$site.credits_text}
|
|
image={$site.seo_share_image.full_url}
|
|
/>
|
|
</svelte:head>
|
|
|
|
<section class="page">
|
|
<div class="wrap">
|
|
<div class="page__top page__part">
|
|
<a href="/" class="button-control button-control--pink dir-left">
|
|
<IconArrow direction="left" color="#fff" class="icon" />
|
|
<IconArrow direction="left" color="#fff" class="icon" hidden="true" />
|
|
</a>
|
|
|
|
<TitleSite />
|
|
</div>
|
|
|
|
<div class="page__description page__part style-description">
|
|
<p>{$site.credits_text}</p>
|
|
</div>
|
|
|
|
<div class="page__list page__part">
|
|
{#each $site.credits_list as category}
|
|
<div class="page__category">
|
|
<h2 class="title-category">{category.name}</h2>
|
|
{#each category.credits as person}
|
|
<dl>
|
|
<dt class="style-location">
|
|
{#if person.url}
|
|
<LinkTranslate href={person.url} text={person.name} target="_blank" rel="noopener" />
|
|
{:else}
|
|
{person.name}
|
|
{/if}
|
|
</dt>
|
|
<dd class="style-caps style-caps style-caps--transparent">{person.role}</dd>
|
|
</dl>
|
|
{/each}
|
|
</div>
|
|
{/each}
|
|
</div>
|
|
|
|
<InteractiveGlobe type="part" />
|
|
</div>
|
|
|
|
<Footer />
|
|
</section>
|