diff options
| -rw-r--r-- | src/components/Sections/LatestPosts.astro | 35 | ||||
| -rw-r--r-- | src/components/Sections/Welcome.astro | 2 | ||||
| -rw-r--r-- | src/pages/index.astro | 2 |
3 files changed, 38 insertions, 1 deletions
diff --git a/src/components/Sections/LatestPosts.astro b/src/components/Sections/LatestPosts.astro new file mode 100644 index 0000000..04ce9fe --- /dev/null +++ b/src/components/Sections/LatestPosts.astro @@ -0,0 +1,35 @@ +--- +import { getCollection } from "astro:content"; +import dayjs from "dayjs"; + +const posts = await getCollection("blog", ({ data }) => { + return data.draft !== true; +}); + +posts.sort((a, b) => b.data.pubDate.getTime() - a.data.pubDate.getTime()); + +const latestPosts = posts.slice(0, 5); +--- + +<style lang="scss"> + @use "../../scss/variables" as *; + + small { + font-size: $fontSizeBase * 0.75; + opacity: 0.5; + } +</style> + +<section> + <h2>Latest posts</h2> + <ul> + { + latestPosts.map((post) => ( + <li> + <a href={`/blog/${post.slug}`}>{post.data.title}</a> + <small>{dayjs(post.data.pubDate.toString()).format("MMMM DD, YYYY")}</small> + </li> + )) + } + </ul> +</section> diff --git a/src/components/Sections/Welcome.astro b/src/components/Sections/Welcome.astro index 5d64206..15ae0a3 100644 --- a/src/components/Sections/Welcome.astro +++ b/src/components/Sections/Welcome.astro @@ -3,7 +3,7 @@ <h1>Hi, I'm Valentin Popov 👋</h1> <p> I'm a professional software developer currently working as a project manager and team lead. On my personal - website, I share insights, ideas, and articles on software development, leadership, and the digital world. + website, I share thoughts on tech, leadership, and digital life. </p> <p>Welcome, and feel free to explore!</p> </div> diff --git a/src/pages/index.astro b/src/pages/index.astro index 87bd89c..e7ae23d 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -1,5 +1,6 @@ --- import Layout from "../layouts/BaseLayout.astro"; +import LatestPostsSection from "../components/Sections/LatestPosts.astro"; import SocialLinksSection from "../components/Sections/SocialLinks.astro"; import WelcomeSection from "../components/Sections/Welcome.astro"; --- @@ -7,4 +8,5 @@ import WelcomeSection from "../components/Sections/Welcome.astro"; <Layout> <WelcomeSection /> <SocialLinksSection /> + <LatestPostsSection /> </Layout> |