Adeyemi AdetunjiandRotimi Best
e6a3cf9332
* feat: upgrade to svelte 5 & tailwind v4 + add navigation menu to ui package * feat: website navigation with nav menu from shadcn * chore: refactor navigation menu storybook * fix: responsiveness bug * chore: remove tailwind config file * chore: - remove carbon icons from repo - add Geist font family * refactor website --------- Co-authored-by: Rotimi Best <best@classroomio.com>
49 lines
1.2 KiB
Svelte
49 lines
1.2 KiB
Svelte
<script>
|
|
import { Badge } from '@cio/ui/base/badge';
|
|
import { formatDate } from '$lib/utils/format-date';
|
|
|
|
export let post;
|
|
export let isRecommended = false;
|
|
</script>
|
|
|
|
{#if !isRecommended}
|
|
<div class="mb-5 flex md:flex-row flex-col md:items-center gap-2">
|
|
<!-- Date -->
|
|
<p class="text-sm text-slate-500">{formatDate(post.date)}</p>
|
|
|
|
<!-- Tags -->
|
|
<div class="flex flex-col">
|
|
<div class="flex flex-wrap gap-2">
|
|
{#each post.tags as tag}
|
|
<Badge variant="outline">{tag}</Badge>
|
|
{/each}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{/if}
|
|
|
|
<a href="/blog/{post.slug}" class="group">
|
|
<img
|
|
loading="lazy"
|
|
src={post.imageUrl}
|
|
alt={post.title}
|
|
class="w-70 h-48 object-cover rounded-md"
|
|
/>
|
|
<p
|
|
class="font-bold text-lg py-2 {isRecommended &&
|
|
'h-[60px]'} line-clamp-2 group-hover:text-slate-500"
|
|
>
|
|
{@html post.title}
|
|
</p>
|
|
|
|
<p class="text-slate-500 pt-2 mb-4 line-clamp-3">{post.description}</p>
|
|
</a>
|
|
|
|
<div class="flex items-center justify-start gap-4 my-2">
|
|
<img loading="lazy" src={post.avatar} alt="avatar" class="w-10 h-10 rounded-full" />
|
|
<span>
|
|
<p class="font-semibold">{post.author}</p>
|
|
<p class="text-slate-500">{post.role}</p>
|
|
</span>
|
|
</div>
|