deployn/astro-deploy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore(blog): update blog index page

Browse Source
This commit is contained in:
Jewgeni Lewash 2024-03-12 00:04:44 +01:00
parent f3d2ba6ab8
commit 33245e37de
1 changed files with 11 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/pages/blog/[...page].astro
View File

@ -44,27 +44,27 @@ const {
<BaseLayout <BaseLayout
title="Blog | Astro Deploy" title="Blog | Astro Deploy"
description="Explore insightful articles on our Blog: Dive into a world of knowledge through posts crafted with expertise. Discover, learn, and grow with us."> description="Explore insightful articles on our Blog: Dive into a world of knowledge through posts crafted with expertise. Discover, learn, and grow with us.">
<div class="container mx-auto px-4 py-16 sm:py-24 lg:px-8 lg:py-32 xl:max-w-7xl"> <div class="container mx-auto px-4 py-8 sm:py-12 lg:px-8 lg:py-16 xl:max-w-7xl">
<div class="mb-12 text-center text-zinc-900 dark:text-zinc-200"> <div class="text-center text-zinc-800 dark:text-zinc-200">
<Heading level={1}>Blog</Heading> <Heading level={1}>Blog</Heading>
<Search /> <Search />
<p>Here are some blogposts, they are located in the repository as mdx files.</p> <p class="text-lg leading-relaxed text-zinc-600 dark:text-zinc-400">
Here are some blogposts, they are located in the repository as mdx files.
</p>
</div> </div>
<hr class="mb-12 dark:border-zinc-700/75" /> <hr class="my-8 border-t border-zinc-300 dark:border-zinc-700" />
<div class="grid grid-cols-1 gap-8 md:grid-cols-2"> <div class="grid grid-cols-1 gap-8 md:grid-cols-2">
{ {
page.data.map((post) => ( page.data.map((post) => (
<div class="flex flex-col space-y-4"> <div class="rotate-1 transform rounded-lg bg-white p-6 shadow-md transition-transform duration-300 hover:rotate-0 dark:bg-zinc-800">
<h2 <h2
transition:name={post.data.title} transition:name={post.data.title}
class="text-lg font-semibold text-zinc-800 hover:text-zinc-600 dark:text-zinc-200 dark:hover:text-zinc-400 sm:text-xl"> class="mb-2 text-xl font-semibold text-zinc-800 hover:text-zinc-600 dark:text-zinc-200 dark:hover:text-zinc-400">
<a href={`/blog/${post.slug}/`}>{post.data.title}</a> <a href={`/blog/${post.slug}/`}>{post.data.title}</a>
</h2> </h2>
<p class="text-sm leading-relaxed text-zinc-600 dark:text-zinc-400"> <p class="mb-4 text-sm text-zinc-600 dark:text-zinc-400">{post.data.description}</p>
{post.data.description}
</p>
<a <a
class="text-sm font-medium text-primary-600 hover:text-primary-400 dark:text-primary-400 dark:hover:text-primary-300" class="text-primary-600 hover:text-primary-400 dark:text-primary-400 dark:hover:text-primary-300"
href={`/blog/${post.slug}/`}> href={`/blog/${post.slug}/`}>
Read more Read more
</a> </a>
@ -72,7 +72,7 @@ const {
)) ))
} }
</div> </div>
<div class="mt-12 text-black dark:text-white"> <div class="mt-12 text-center text-black dark:text-white">
<Pagination> <Pagination>
<PaginationContent> <PaginationContent>
{ {