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>