mikeconrad/blog
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update post collection and show category on posts

Browse Source
This commit is contained in:
prototypa
2023-01-24 01:26:37 -05:00
parent c9c555e0ef
commit 64bcda934c
12 changed files with 42 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/blog/Headline.astro
View File

@ -3,9 +3,7 @@ const { title = await Astro.slots.render('default'), subtitle = await Astro.slot
---
<header class="mb-8 md:mb-16 text-center max-w-3xl mx-auto">
<h1 class="text-4xl md:text-5xl font-bold leading-tighter tracking-tighter font-heading">
{title}
</h1>
<h1 class="text-4xl md:text-5xl font-bold leading-tighter tracking-tighter font-heading" set:html={title} />
{
subtitle && (
<div class="mt-2 md:mt-3 mx-auto text-xl text-gray-500 dark:text-slate-400 font-medium" set:html={subtitle} />

11
src/components/blog/ListItem.astro
View File

@ -43,8 +43,19 @@ const link = !BLOG?.post?.disabled ? getPermalink(post.permalink, 'post') : '';
<header>
<div class="mb-1">
<span class="text-sm">
<Icon name="tabler:clock" class="w-3.5 h-3.5 inline-block -mt-0.5 dark:text-gray-400" />
<time datetime={String(post.publishDate)}>{getFormattedDate(post.publishDate)}</time>
{
post.category && (
<>
{' '} ·
<a class="capitalize hover:underline" href={getPermalink(post.category, 'category')}>
{post.category.replaceAll('-', ' ')}
</a>
</>
)
}
</span>
</div>
<h2 class="text-xl sm:text-2xl font-bold leading-tight mb-2 font-heading dark:text-slate-300">

14
src/components/blog/SinglePost.astro
View File

@ -5,6 +5,7 @@ import { Picture } from '@astrojs/image/components';
import PostTags from '~/components/blog/Tags.astro';
import SocialShare from '~/components/common/SocialShare.astro';
import { getPermalink } from '~/utils/permalinks';
import { getFormattedDate } from '~/utils/utils';
import type { Post } from '~/types';
@ -22,8 +23,19 @@ const { post, url } = Astro.props;
<header class={post.image ? '' : ''}>
<div class="flex justify-between flex-col sm:flex-row max-w-3xl mx-auto mt-0 mb-2 px-4 sm:px-6 sm:items-center">
<p>
<Icon name="tabler:clock" class="w-4 h-4 inline-block -mt-1 dark:text-gray-400" />
<Icon name="tabler:clock" class="w-4 h-4 inline-block -mt-0.5 dark:text-gray-400" />
<time datetime={String(post.publishDate)}>{getFormattedDate(post.publishDate)}</time>
{
post.category && (
<>
{' '}
·
<a class="font-bold capitalize" href={getPermalink(post.category, 'category')}>
{post.category.replaceAll('-', ' ')}
</a>
</>
)
}
</p>
</div>
<h1