78 lines
2.4 KiB
Svelte
78 lines
2.4 KiB
Svelte
<script lang="ts">
|
|
import dayjs from 'dayjs';
|
|
|
|
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 GhostStyle from '@damillora/plachta/components/Base/GhostStyle.svelte';
|
|
import { processPostHtml } from '$lib/content/postProcessor';
|
|
|
|
import type { Load } from '@sveltejs/kit';
|
|
import {
|
|
browseNextPost,
|
|
browsePrevPost,
|
|
browseRelatedPost,
|
|
readPost
|
|
} from '$lib/content/contentApi';
|
|
import { browser } from '$app/environment';
|
|
import PostSeo from '$lib/components/SEO/PostSEO.svelte';
|
|
import { onMount } from 'svelte';
|
|
import { afterNavigate } from '$app/navigation';
|
|
import ResponsiveHero from '$lib/components/ResponsiveHero.svelte';
|
|
|
|
export let data;
|
|
</script>
|
|
|
|
<svelte:head>
|
|
<title>{data.post.title}</title>
|
|
</svelte:head>
|
|
|
|
<PostSeo post={data.post} />
|
|
|
|
<ResponsiveHero background={data.post.feature_image} />
|
|
|
|
<Container>
|
|
<Post>
|
|
<PostHeader
|
|
title={data.post.title}
|
|
authors={data.post.authors}
|
|
primary_tag={data.post.primary_tag}
|
|
date={dayjs(data.post.published_at).format('DD MMM YYYY')}
|
|
reading_time={`${data.post.reading_time} min read`}
|
|
/>
|
|
<PostMain>
|
|
<GhostStyle>
|
|
{@html data.post.html}
|
|
|
|
<br/>
|
|
</GhostStyle>
|
|
<svelte:fragment slot="comments" />
|
|
</PostMain>
|
|
<PostNavigator prev_post={data.prevPost} next_post={data.nextPost} />
|
|
</Post>
|
|
|
|
<PostRelated
|
|
name={data.post.primary_tag.name}
|
|
url={data.post.primary_tag.url}
|
|
accent_color={data.post.primary_tag.accent_color}
|
|
>
|
|
{#each data.relatedPost as post}
|
|
<PostCard
|
|
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`}
|
|
excerpt={post.excerpt}
|
|
feature_image={post.feature_image ?? '/images/default-feature.jpg'}
|
|
url={post.url}
|
|
/>
|
|
{/each}
|
|
</PostRelated>
|
|
</Container>
|