feat: add dates to selected

This commit is contained in:
2026-03-06 22:44:13 -06:00
parent 8a7b6b97b7
commit 091af909d4
3 changed files with 36 additions and 21 deletions

View File

@@ -2,17 +2,19 @@
import { Icon } from 'astro-icon/components';
import { Image } from 'astro:assets';
import { formatDate } from '@support/time';
import { getDirectusImageURL } from '@/support/url';
interface Props {
title: string;
subTitle: string;
url: string;
pubDate: Date,
img: string;
imgAlt: string;
}
const { title, subTitle, url, img, imgAlt } = Astro.props;
const { title, subTitle, url, pubDate, img, imgAlt } = Astro.props;
---
<div class="smooth-reveal flex flex-col px-4 py-10 mx-auto w-full">
@@ -40,17 +42,21 @@ const { title, subTitle, url, img, imgAlt } = Astro.props;
<p class="card-text-title font-light text-pretty sm:text-lg max-w-prose mb-8">
{subTitle}
</p>
<div class="button-base button-bg-teal inline-flex rounded-lg gap-x-2">
<div class="button-text-title flex relative items-center text-center">
<span class="mr-2">
Read More
</span>
<Icon
name="mdi:keyboard-arrow-right"
class="button-hover-arrow"
/>
<div class="flex items-center justify-between w-full">
<div class="button-base button-bg-teal inline-flex rounded-lg gap-x-2">
<div class="button-text-title flex relative items-center text-center">
<span class="mr-2">
Read More
</span>
<Icon
name="mdi:keyboard-arrow-right"
class="button-hover-arrow"
/>
</div>
</div>
<span class="card-text-description text-sm ml-auto">
{formatDate(pubDate)}
</span>
</div>
</div>
</a>
</div>

View File

@@ -2,19 +2,21 @@
import { Icon } from 'astro-icon/components';
import { Image } from 'astro:assets';
import { formatDate } from '@support/time';
import { getDirectusImageURL } from '@/support/url';
interface Props {
title: string;
subTitle: string;
url: string;
pubDate: Date;
imgOne: string;
imgOneAlt: string;
imgTwo?: string;
imgTwoAlt?: string;
}
const { title, subTitle, url, imgOne, imgOneAlt, imgTwo, imgTwoAlt } = Astro.props;
const { title, subTitle, url, pubDate, imgOne, imgOneAlt, imgTwo, imgTwoAlt } = Astro.props;
---
<div class="smooth-reveal flex flex-col px-4 py-10 mx-auto w-full">
@@ -30,16 +32,21 @@ const { title, subTitle, url, imgOne, imgOneAlt, imgTwo, imgTwoAlt } = Astro.pro
<p class="card-text-title font-light text-pretty sm:text-lg max-w-prose mb-8">
{subTitle}
</p>
<div class="button-base button-bg-teal inline-flex rounded-lg gap-x-2">
<div class="button-text-title flex relative items-center text-center">
<span class="mr-2">
Read More
</span>
<Icon
name="mdi:keyboard-arrow-right"
class="button-hover-arrow"
/>
<div class="flex items-center justify-between w-full">
<div class="button-base button-bg-teal inline-flex rounded-lg gap-x-2">
<div class="button-text-title flex relative items-center text-center">
<span class="mr-2">
Read More
</span>
<Icon
name="mdi:keyboard-arrow-right"
class="button-hover-arrow"
/>
</div>
</div>
<span class="card-text-description text-sm ml-auto">
{formatDate(pubDate)}
</span>
</div>
</div>
{!imgTwo ? (

View File

@@ -17,6 +17,7 @@ const { posts } = Astro.props;
title={post.title}
subTitle={post.description}
url={`/blog/${post.slug}`}
pubDate={post.published_date}
img={post.image}
imgAlt={post.image_alt}
/>
@@ -25,6 +26,7 @@ const { posts } = Astro.props;
title={post.title}
subTitle={post.description}
url={`/blog/${post.slug}`}
pubDate={post.published_date}
imgOne={post.image}
imgOneAlt={post.image_alt}
imgTwo={post?.image_second}