---
import Layout from '../../layouts/Layout.astro';

export async function getStaticPaths() {
  // Placeholder slugs - would fetch from CMS
  const slugs = [
    '2-zhao-yao-kong-xiao-fei-zhe-de-xin',
    '2022-jie-qing-xing-xiao-quan-gong-lue',
    // Add all from sitemap
  ];

  return slugs.map(slug => ({
    params: { slug },
    props: { slug }
  }));
}

const { slug } = Astro.props;

// Placeholder content - would fetch from CMS
const post = {
  title: 'Sample Post Title',
  date: 'January 20, 2022',
  content: 'Sample content...'
};
---

<Layout>
  <section class="post-section">
    <div class="container">
      <a href="/news" class="back-link">回到文章列表</a>
      <article>
        <h1>{post.title}</h1>
        <p class="post-date">文章發布日期：{post.date}</p>
        <div class="post-content prose prose-custom max-w-none">
          <p>{post.content}</p>
          <!-- More content would be rendered here with markdown -->
        </div>
      </article>
    </div>
  </section>
</Layout>

<style>
  .post-section {
    padding: 40px 0;
  }
  .container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
  }
  .back-link {
    display: inline-block;
    margin-bottom: 20px;
    color: #007bff;
    text-decoration: none;
  }
  .post-date {
    color: #666;
    margin-bottom: 20px;
  }
  .post-content {
    /* Prose styles handle typography */
  }
</style>