refactor: split parts into standalone components

This commit is contained in:
草师傅 2025-07-20 13:44:20 +08:00
parent 498155fea3
commit d9f04f1a88
Signed by: gb
GPG key ID: 43330A030E2D6478
7 changed files with 73 additions and 66 deletions

View file

@ -3,6 +3,7 @@ import Layout from '../layouts/Layout.astro';
import { getCollection } from 'astro:content';
import NewsLetter from "../components/NewsLetter.astro";
import {siteConfig} from "../config";
import ArticleList from "../components/ArticleList.astro";
const posts = await getCollection('posts');
posts.sort((a, b) => new Date(b.data.pubDate).getTime() - new Date(a.data.pubDate).getTime());
@ -16,22 +17,7 @@ posts.sort((a, b) => new Date(b.data.pubDate).getTime() - new Date(a.data.pubDat
<div style="margin-top: 2rem;">
<span class="command">ls -la posts/</span>
<div style="margin-top: 1rem; margin-left: 1rem;">
{posts.map((post) => (
<p>
<span class="list-date">{new Date(post.data.pubDate).toISOString().split('T')[0]}</span>
<a href={`/blog/${post.slug}`}>{post.data.title}</a>
</p>
))}
{posts.length === 0 && (
<>
<p>
<span style="color: var(--terminal-yellow);">No posts here yet</span>
</p>
</>
)}
</div>
<ArticleList posts={posts} displayDate={true} placeholder={true} />
</div>
<div style="margin-top: 2rem;">

View file

@ -1,6 +1,7 @@
---
import Layout from '../../layouts/Layout.astro';
import {getCollection} from "astro:content";
import ArticleList from "../../components/ArticleList.astro";
export async function getStaticPaths() {
const allPosts = await getCollection('posts');
@ -25,12 +26,7 @@ const { posts } = Astro.props;
<Layout title={`posts tagged with ${category}`} description={`Posts tagged with ${category}`}>
<h1 class="title">ls ~/blog | grep "{category}"</h1>
<ul>
{posts.map((post: any) =>
<p>
<span class="list-date">{new Date(post.data.pubDate).toISOString().split('T')[0]}</span>
<a href={`/blog/${post.slug}`}>{post.data.title}</a>
</p>
)}
<ArticleList posts={posts} displayDate={true} />
</ul>
</Layout>

View file

@ -1,6 +1,7 @@
---
import Layout from '../../layouts/Layout.astro';
import {getCollection} from "astro:content";
import ArticleList from "../../components/ArticleList.astro";
export async function getStaticPaths() {
const allPosts = await getCollection('posts');
@ -21,11 +22,6 @@ const { posts } = Astro.props;
<Layout title={`posts tagged with ${tag}`} description={`Posts tagged with ${tag}`}>
<h1 class="title">ls ~/blog | grep "{tag}"</h1>
<ul>
{posts.map((post: any) =>
<p>
<span class="list-date">{new Date(post.data.pubDate).toISOString().split('T')[0]}</span>
<a href={`/blog/${post.slug}`}>{post.data.title}</a>
</p>
)}
<ArticleList posts={posts} displayDate={true} />
</ul>
</Layout>