feat: 首页与新闻列表/详情页面

2026-07-23 19:15:27 +08:00
parent eab95953bf
commit c80ada6af5
4 changed files with 82 additions and 0 deletions
@@ -0,0 +1,19 @@
+---
+import '../styles/global.css';
+interface Props { title: string; }
+const { title } = Astro.props;
+---
+<!DOCTYPE html>
+<html lang="zh-CN">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="icon" href="/favicon.svg" />
+    <title>{title}</title>
+  </head>
+  <body>
+    <header><a href="/" style="font-weight:700;font-size:1.25rem;">官网基座</a></header>
+    <main><slot /></main>
+    <footer style="margin-top:3rem;font-size:.85rem;color:#888;">© 官网基座</footer>
+  </body>
+</html>
@@ -0,0 +1,21 @@
+---
+import BaseLayout from '../layouts/BaseLayout.astro';
+import { getCollection } from 'astro:content';
+
+const news = (await getCollection('news')).sort(
+  (a, b) => b.data.date.getTime() - a.data.date.getTime()
+);
+---
+<BaseLayout title="官网基座 · 首页">
+  <h1>官网基座</h1>
+  <p>Phase 0 技术验证站点。</p>
+  <section>
+    <h2>最新动态</h2>
+    <ul>
+      {news.map((post) => (
+        <li><a href={`/news/${post.id}/`}>{post.data.title}</a> <small>{post.data.date.toLocaleDateString('zh-CN')}</small></li>
+      ))}
+    </ul>
+    <p><a href="/news/">查看全部 →</a></p>
+  </section>
+</BaseLayout>
@@ -0,0 +1,23 @@
+---
+import BaseLayout from '../../layouts/BaseLayout.astro';
+import { getCollection, render } from 'astro:content';
+
+export async function getStaticPaths() {
+  const news = await getCollection('news');
+  return news.map((post) => ({
+    params: { slug: post.id },
+    props: { post },
+  }));
+}
+
+const { post } = Astro.props;
+const { Content } = await render(post);
+---
+<BaseLayout title={post.data.title}>
+  <article>
+    <h1>{post.data.title}</h1>
+    <p><small>{post.data.category} · {post.data.date.toLocaleDateString('zh-CN')}</small></p>
+    <Content />
+  </article>
+  <p><a href="/news/">← 返回列表</a></p>
+</BaseLayout>
@@ -0,0 +1,19 @@
+---
+import BaseLayout from '../../layouts/BaseLayout.astro';
+import { getCollection } from 'astro:content';
+
+const news = (await getCollection('news')).sort(
+  (a, b) => b.data.date.getTime() - a.data.date.getTime()
+);
+---
+<BaseLayout title="新闻动态">
+  <h1>新闻动态</h1>
+  <ul>
+    {news.map((post) => (
+      <li>
+        <a href={`/news/${post.id}/`}>{post.data.title}</a>
+        <small> · {post.data.category} · {post.data.date.toLocaleDateString('zh-CN')}</small>
+      </li>
+    ))}
+  </ul>
+</BaseLayout>