133 lines
3.3 KiB
Svelte
133 lines
3.3 KiB
Svelte
<script lang="ts" context="module">
|
|
export const load: Load = async ({ params }) => {
|
|
const postSlug = params.slug;
|
|
const post = await readPost(postSlug);
|
|
|
|
return {
|
|
props: {
|
|
post: post
|
|
}
|
|
};
|
|
};
|
|
</script>
|
|
|
|
<script lang="ts">
|
|
import dayjs from 'dayjs';
|
|
import fitvids from 'fitvids';
|
|
|
|
import Hero from '@damillora/plachta/components/Hero/Hero.svelte';
|
|
import PostHeader from '@damillora/plachta/components/Post/PostHeader.svelte';
|
|
import Post from '@damillora/plachta/components/PageTypes/Post.svelte';
|
|
import PostMain from '@damillora/plachta/components/Post/PostMain.svelte';
|
|
import PostNavigator from '@damillora/plachta/components/Post/PostNavigator.svelte';
|
|
import Container from '@damillora/plachta/components/Container/Container.svelte';
|
|
import PostRelated from '@damillora/plachta/components/Post/PostRelated.svelte';
|
|
import PostCard from '@damillora/plachta/components/PostCard/PostCard.svelte';
|
|
import type { Load } from '@sveltejs/kit';
|
|
import { readPost } from '$lib/content/contentApi';
|
|
import { browser } from '$app/env';
|
|
import PostSeo from '$lib/components/SEO/PostSEO.svelte';
|
|
|
|
export let post: any;
|
|
|
|
if (browser) {
|
|
fitvids();
|
|
}
|
|
</script>
|
|
|
|
<svelte:head>
|
|
<title>{post.title}</title>
|
|
</svelte:head>
|
|
|
|
<PostSeo post={post} />
|
|
<Hero background={post.feature_image ?? `/images/default-feature.jpg`} />
|
|
|
|
<Container>
|
|
<Post>
|
|
<PostHeader
|
|
title={post.title}
|
|
authors={post.authors}
|
|
primary_tag={post.primary_tag}
|
|
date={dayjs(post.published_at).format('DD MMM YYYY')}
|
|
reading_time={`${post.reading_time} min read`}
|
|
/>
|
|
<PostMain>
|
|
{@html post.html}
|
|
<svelte:fragment slot="comments" />
|
|
</PostMain>
|
|
<PostNavigator
|
|
prev_post={{
|
|
url: '/examples/post-page',
|
|
title: 'Sophie!'
|
|
}}
|
|
next_post={{
|
|
url: '/examples/post-page',
|
|
title: 'Sophie!'
|
|
}}
|
|
/>
|
|
</Post>
|
|
|
|
<PostRelated name="Sophie" url="https://google.com" accent_color="#3b34dc">
|
|
<PostCard
|
|
authors={[
|
|
{
|
|
profile_image: 'https://images.nanao.moe/r/GDuirR.jpg',
|
|
url: '/examples/post-page',
|
|
name: 'Sophie Neuenmuller'
|
|
}
|
|
]}
|
|
date="2022 November 2020"
|
|
excerpt="Sophie!"
|
|
feature_image="https://images.nanao.moe/r/7jETH3.png"
|
|
primary_tag={{
|
|
accent_color: '#3b7b9c',
|
|
name: 'Sound Voltex',
|
|
url: '/examples/post-page'
|
|
}}
|
|
reading_time="3 min"
|
|
title="Sophie!"
|
|
url="/examples/post-page"
|
|
/>
|
|
<PostCard
|
|
authors={[
|
|
{
|
|
profile_image: 'https://images.nanao.moe/r/GDuirR.jpg',
|
|
url: '/examples/post-page',
|
|
name: 'Sophie Neuenmuller'
|
|
}
|
|
]}
|
|
date="2022 November 2020"
|
|
excerpt="Sophie!"
|
|
feature_image="https://images.nanao.moe/r/7jETH3.png"
|
|
primary_tag={{
|
|
accent_color: '#3b7b9c',
|
|
name: 'Sound Voltex',
|
|
url: '/examples/post-page'
|
|
}}
|
|
reading_time="3 min"
|
|
title="Sophie!"
|
|
url="/examples/post-page"
|
|
/>
|
|
<PostCard
|
|
authors={[
|
|
{
|
|
profile_image: 'https://images.nanao.moe/r/GDuirR.jpg',
|
|
url: '/examples/post-page',
|
|
name: 'Sophie Neuenmuller'
|
|
}
|
|
]}
|
|
date="2022 November 2020"
|
|
excerpt="Sophie!"
|
|
feature_image="https://images.nanao.moe/r/7jETH3.png"
|
|
primary_tag={{
|
|
accent_color: '#3b7b9c',
|
|
name: 'Sound Voltex',
|
|
url: '/examples/post-page'
|
|
}}
|
|
reading_time="3 min"
|
|
title="Sophie!"
|
|
url="/examples/post-page"
|
|
/>
|
|
</PostRelated>
|
|
</Container>
|