alexlebens/site-profile
1
0
Fork 0
Code Issues 1 Pull Requests Actions Activity

feat: add dates to selected

Browse Source
This commit is contained in:
Alex Lebens
2026-03-06 22:44:13 -06:00
parent 8a7b6b97b7
commit 091af909d4
3 changed files with 36 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/components/cards/LargeBlogLeftCard.astro
View File

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

27
src/components/cards/LargeBlogRightCard.astro
View File

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

2
src/components/sections/SelectedPostsSection.astro
View File

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