From 0b57b888caf8817ff4992c59ed40ed29bee34fd4 Mon Sep 17 00:00:00 2001
From: Valentin Popov <valentin@popov.link>
Date: Thu, 12 Sep 2024 14:06:44 +0000
Subject: Add PostPagination component for blog post navigation

---
 src/components/PostPagination.astro | 47 +++++++++++++++++++++++++++++++++++++
 1 file changed, 47 insertions(+)
 create mode 100644 src/components/PostPagination.astro

(limited to 'src/components/PostPagination.astro')

diff --git a/src/components/PostPagination.astro b/src/components/PostPagination.astro
new file mode 100644
index 0000000..6ae6bef
--- /dev/null
+++ b/src/components/PostPagination.astro
@@ -0,0 +1,47 @@
+---
+const { prevPost, nextPost } = Astro.props;
+---
+
+<style lang="scss">
+	.pagination {
+		overflow: hidden;
+		padding: 5rem 0;
+		width: 100%;
+	}
+
+	@media (width <=684px) {
+		.pagination {
+			padding: 2rem 0;
+		}
+	}
+
+	.prev,
+	.next {
+		max-width: 40%;
+	}
+
+	.prev {
+		float: left;
+	}
+
+	.next {
+		float: right;
+	}
+</style>
+
+<div class="pagination">
+	{
+		prevPost && (
+			<span class="prev">
+				<a href={`/blog/${prevPost.slug}`}>&lt; {prevPost.data.title}</a>
+			</span>
+		)
+	}
+	{
+		nextPost && (
+			<span class="next">
+				<a href={`/blog/${nextPost.slug}`}>{nextPost.data.title} &gt;</a>
+			</span>
+		)
+	}
+</div>
-- 
cgit v1.2.3